/* ============ Кабинет: монохром — чёрный, графит, белый ============ */

:root {
  --k-bg: #060607;
  --k-card: linear-gradient(180deg, #111114 0%, #0b0b0d 100%);
  --k-raised: #141417;
  --k-well: #08080a;
  --k-line: rgba(255, 255, 255, .075);
  --k-line-2: rgba(255, 255, 255, .12);
  --k-line-3: rgba(255, 255, 255, .22);
  --k-text: #f5f5f6;
  --k-dim: #a3a3ab;
  --k-mute: #6e6e77;
  --k-faint: #45454c;
  --k-white: linear-gradient(180deg, #ffffff 0%, #e7e7ea 100%);
  --k-ink: #09090b;
  --k-ok: #4ade80;
  --k-bad: #fb7185;
  --k-warn: #fbbf24;
  --k-r: 22px;
  --k-r-md: 16px;
  --k-r-sm: 12px;
  --k-ease: cubic-bezier(.22, 1, .36, 1);
  --k-spring: cubic-bezier(.34, 1.5, .55, 1);
  --k-lift: inset 0 1px 0 rgba(255, 255, 255, .045), 0 1px 0 rgba(0, 0, 0, .6), 0 24px 48px -24px rgba(0, 0, 0, .8);

  --c-bg: var(--k-bg);
  --c-surface: var(--k-card);
  --c-card-in: var(--k-well);
  --c-well: rgba(255, 255, 255, .025);
  --c-line: var(--k-line);
  --c-line-hi: var(--k-line-3);
  --c-hair: rgba(255, 255, 255, .06);
  --c-glow: var(--k-lift);
  --c-radius: var(--k-r);
  --c-pill: var(--k-white);
  --c-gold: var(--k-white);
  --c-mint: var(--k-ok);
  --c-ease: var(--k-ease);
}

html.af-signed body.is-loading #guest,
html.af-signed body.is-loading #top-login,
html.af-signed body.is-loading #top-nav-guest,
html.af-signed body.is-loading #burger { display: none !important; }
html.af-signed #boot { display: none !important; }
html.af-signed, html.in-tg-desk,
html.af-signed body.is-loading, html.in-tg-desk body.is-loading { background: #060607; }
html.af-signed body.is-loading .sky, html.in-tg-desk body.is-loading .sky { background: #060607; }
html.af-signed body.is-loading .sky-glow, html.in-tg-desk body.is-loading .sky-glow { display: none; }
html.af-signed body.is-loading .sky-stars,
html.in-tg-desk body.is-loading .sky-stars { opacity: .95; }
html.af-signed body.is-loading .top, html.af-signed body.is-loading #tabbar,
html.in-tg-desk body.is-loading .top, html.in-tg-desk body.is-loading #tabbar { visibility: hidden; }
html:has(body.is-loading),
body.is-loading { overflow: hidden !important; }
body.is-booted .k-cosmos { animation: none; opacity: 1; }

/* --- Фон и шапка: без цветной дымки --- */
body.wx-app {
  background: var(--k-bg);
  color: var(--k-text);
  -webkit-font-smoothing: antialiased;
}
html:has(> body.wx-app) {
  background: var(--k-bg);
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .72) transparent;
}
html:has(> body.wx-app) ::-webkit-scrollbar { width: 8px; height: 8px; background: transparent; }
html:has(> body.wx-app) ::-webkit-scrollbar-track,
html:has(> body.wx-app) ::-webkit-scrollbar-track-piece,
html:has(> body.wx-app) ::-webkit-scrollbar-corner { background: transparent; }
html:has(> body.wx-app) ::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
  background-image: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, .72) 16%, rgba(255, 255, 255, .22) 58%, rgba(255, 255, 255, .55) 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35), 0 0 10px rgba(255, 255, 255, .28);
}
html:has(> body.wx-app) ::-webkit-scrollbar-thumb:hover {
  background-image: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, .9) 22%, rgba(255, 255, 255, .4) 70%, #fff 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .6), 0 0 14px rgba(255, 255, 255, .45);
}

body.wx-app .sky,
html.is-ios body.wx-app .sky {
  background-color: #060607 !important;
  background-image: none !important;
}
html.is-mobile body.wx-app .sky,
html.is-ios body.wx-app .sky {
  position: fixed;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: calc(-1 * max(240px, env(safe-area-inset-bottom, 0px) + 180px));
  width: 100%;
  height: auto;
  min-height: calc(100lvh + max(240px, env(safe-area-inset-bottom, 0px) + 180px));
  overflow: visible;
}
html.is-mobile body.wx-app,
html.is-ios body.wx-app {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}
body.wx-app .wx-spot { opacity: 0 !important; background: none !important; }
html.is-ios:has(body.wx-app),
html:has(> body.wx-app) {
  background: #060607 !important;
  background-color: #060607 !important;
}
html.is-ios:has(body.wx-app),
html.is-ios body.wx-app {
  overscroll-behavior: none;
}
body.wx-app .sky-glow,
body.wx-app .sky-stars,
html.is-mobile body.wx-app .app::before { display: none !important; }

/* Космос: холст со звёздами и Млечным Путём рисует lk.js */
.k-cosmos, .k-flow, .k-world, .k-saturn, .k-tw { display: none; }
body.wx-app .k-cosmos,
body.wx-app .k-flow {
  display: block; position: absolute; left: 0; top: 0; pointer-events: none;
  translate: 0 calc(var(--k-sy, 0) * -.05px);
  contain: strict;
}
body.wx-app .k-cosmos { animation: kCosmosIn 1.6s var(--k-ease) both; }
html[data-k-time="night"] body.wx-app .k-cosmos,
html[data-k-time="night"] body.wx-app .k-flow { filter: brightness(1.25); }

body.wx-app .k-tw {
  display: block; position: absolute; width: var(--s, 2px); height: var(--s, 2px); border-radius: 50%;
  background: #fff; box-shadow: 0 0 6px 1px rgba(255, 255, 255, .55);
  animation: kTwinkle var(--t, 5s) ease-in-out var(--d, 0s) infinite, kRise var(--m, 70s) linear var(--d, 0s) infinite;
  translate: 0 calc(var(--k-sy, 0) * -.05px);
}
body.wx-app .k-tw::before,
body.wx-app .k-tw::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 1px; translate: -50% -50%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .7), transparent);
}
body.wx-app .k-tw::after { rotate: 90deg; }

body.wx-app .k-world {
  display: block; position: absolute; left: 50%; top: calc(100vh - 128px);
  width: 640px; height: 640px; margin-left: -470px;
  translate: 0 calc(var(--k-sy, 0) * -.02px);
}
.k-planet {
  position: absolute; inset: 0; z-index: 1; overflow: hidden; border-radius: 50%;
  background:
    radial-gradient(125% 72% at 74% -8%, rgba(255, 255, 255, .48), rgba(255, 255, 255, .08) 24%, transparent 46%),
    radial-gradient(circle at 46% 40%, #35353c 0%, #151518 44%, #050506 74%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .4),
    inset 0 -40px 80px rgba(0, 0, 0, .35),
    0 -24px 80px -28px rgba(255, 255, 255, .12);
}
.k-planet::before { content: none; }
.k-surf {
  position: absolute; left: 0; top: 0; width: 100%; height: 0; pointer-events: none;
  opacity: 0; transition: opacity 1.2s var(--k-ease);
}
.k-surf.is-on { opacity: 1; }
.k-air {
  position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
  box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .62), inset 0 0 22px rgba(255, 255, 255, .12);
  -webkit-mask-image: radial-gradient(circle at 72% -6%, #000 0%, transparent 44%);
  mask-image: radial-gradient(circle at 72% -6%, #000 0%, transparent 44%);
}
.k-moon {
  position: absolute; z-index: 2; left: 72%; top: 2%; width: 18px; height: 18px; border-radius: 50%;
  background: radial-gradient(circle at 38% 36%, #d2d2d6 0%, #8c8c94 62%, #5a5a62 100%);
  box-shadow: 0 0 0 6px rgba(255, 255, 255, .03);
  animation: kMoon 36s ease-in-out infinite;
}
.is-desktop body.wx-app .k-world { width: 1100px; height: 1100px; top: calc(100vh - 150px); margin-left: -420px; }
.is-desktop body.wx-app .k-moon { width: 26px; height: 26px; }

body.wx-app .k-saturn {
  display: block; position: absolute; right: 8vw; top: 16vh; width: 112px; height: 60px;
  translate: 0 calc(var(--k-sy, 0) * -.09px);
}
body.wx-app .k-saturn svg { display: block; width: 100%; height: 100%; overflow: visible; animation: kFloat 20s ease-in-out infinite; }
html.is-mobile body.wx-app .k-saturn { right: 12px; top: calc(100vh - 300px); width: 78px; height: 42px; }

@keyframes kTwinkle {
  0%, 100% { opacity: .15; scale: .55; }
  50% { opacity: 1; scale: 1; }
}
@keyframes kFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-7px); }
}
/* Подъём звезды — через transform (видеокарта). Раньше margin-top пересчитывал раскладку каждый кадр и грел телефон. */
@keyframes kRise {
  from { transform: translateY(18px); }
  to { transform: translateY(-28px); }
}
@keyframes kCloud { to { background-position: 22% 10%, -16% 8%, 12% 4%; } }
@keyframes kMoon {
  0%, 100% { translate: 0 0; }
  50% { translate: 16px -12px; }
}
@keyframes kCosmosIn { from { opacity: 0; } }
body.wx-app .shoot {
  display: block; height: 1px;
  background: linear-gradient(90deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, .25) 35%, transparent);
  filter: drop-shadow(0 0 3px rgba(255, 255, 255, .6));
  animation-duration: 17s;
}
body.wx-app .shoot:nth-of-type(2) { animation-duration: 23s; }
body.wx-app .shoot:nth-of-type(3) { animation-duration: 31s; }
body.wx-app .k-shoot {
  display: block; position: absolute; width: 72px; height: 1px; border-radius: 2px; pointer-events: none;
  background: linear-gradient(90deg, rgba(255, 255, 255, .9), transparent 80%);
  opacity: 0; rotate: var(--ang, -24deg);
  animation: kShoot linear infinite;
}
@keyframes kShoot {
  0%, 88% { opacity: 0; translate: 0 0; }
  90% { opacity: .85; }
  97% { opacity: 0; translate: -240px 130px; }
  100% { opacity: 0; }
}
body.wx-app .wx-spot { background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 30%), rgba(255, 255, 255, .035), transparent 68%); }
html:has(> body.wx-app) { --cx-a: #f4f4f5; --cx-b: #a1a1aa; }
html:has(> body.wx-app) .cx-dot::after {
  left: -2.5px; top: -2.5px; width: 5px; height: 5px; clip-path: none; border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .7), 0 0 8px rgba(255, 255, 255, .85);
}
html:has(> body.wx-app) .cx-dot::before {
  border-color: rgba(255, 255, 255, .82);
  box-shadow: 0 0 0 2px rgba(0, 0, 0, .5), 0 0 10px rgba(255, 255, 255, .22);
}
html:has(> body.wx-app) .cx-pulse::before {
  clip-path: none; border-radius: 50%;
  background: radial-gradient(circle, #fff 0 10%, transparent 68%);
}
.k-ping {
  position: fixed; z-index: 1; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .55); pointer-events: none;
  animation: kPingOut 1.1s var(--k-ease) forwards;
}
.k-ping + .k-ping { animation-delay: .14s; opacity: 0; }
@keyframes kPingOut {
  0% { opacity: 1; transform: scale(.4); }
  100% { opacity: 0; transform: scale(9); border-color: rgba(255, 255, 255, 0); }
}
@media (prefers-reduced-motion: reduce) {
  body.wx-app .shoot, body.wx-app .k-tw, body.wx-app .k-saturn svg, body.wx-app .k-cosmos,
  body.wx-app .k-shoot, body.wx-app .k-moon, body.wx-app .k-planet::before,
  body.wx-app .brand-name b, body.wx-app .brand-space i, body.wx-app .me-ava::before,
  .pay-sheet .tp-ic-sbp path, .pay-sheet .tp-card-body, .pay-sheet .tp-card-shine,
  .pay-sheet .tp-star-body, .pay-sheet .tp-spark, .pay-sheet .tp-coin, .pay-sheet .tp-coin-back,
  .pay-sheet .tp-world-land, .pay-sheet .tp-world-coin { animation: none; }
  body.wx-app .shoot, body.wx-app .k-shoot { display: none; }
}
body.wx-app ::selection { background: rgba(255, 255, 255, .9); color: #000; }

body.wx-app .top {
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: border-color .3s, background .3s;
}
body.wx-app .top::before { background: transparent !important; }
body.wx-app.wx-scrolled .top {
  border-bottom-color: var(--k-line); background: rgba(6, 6, 7, .78);
  backdrop-filter: blur(18px) saturate(120%); -webkit-backdrop-filter: blur(18px) saturate(120%);
}
html.in-tg-desk.is-desktop body.wx-app .top,
html.in-tg-desk.is-desktop body.wx-app.wx-scrolled .top {
  background: transparent;
  border-bottom-color: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html.in-tg-desk.is-desktop body.wx-app.wx-scrolled .top {
  border-bottom-color: var(--k-line);
  background: rgba(6, 6, 7, .78);
  backdrop-filter: blur(18px) saturate(120%);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
}
body.wx-app .brand { position: relative; }
body.wx-app .brand-name {
  position: relative; z-index: 1; color: #fff;
  background: none; -webkit-text-fill-color: #fff; -webkit-text-stroke: 0;
  text-shadow: none; filter: none; animation: none;
}
body.wx-app .brand-name b {
  background: linear-gradient(105deg, #f6efe4 0%, #ffd7a2 34%, #fffaf2 50%, #e8b56a 68%, #f6efe4 100%);
  background-size: 240% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent; -webkit-text-stroke: 0;
  filter: none; animation: shimmer 7s ease-in-out infinite;
}
body.wx-app .brand-rocket {
  display: block; position: absolute; inset: -8px -4px; z-index: 2;
  width: auto; height: auto; pointer-events: none;
}
body.wx-app .brand-ship,
body.wx-app .brand-rocket svg { display: none; }
body.wx-app .brand-space { inset: 0; }
body.wx-app .brand-space i { animation-name: kLogoFly; animation-duration: 2.6s; }
body.wx-app .brand-space i:nth-child(6),
body.wx-app .brand-space i:nth-child(8) { animation-duration: 1.8s; }
@keyframes kLogoFly {
  0% { transform: translateX(78px); opacity: 0; }
  14% { opacity: .95; }
  100% { transform: translateX(-180px); opacity: 0; }
}
body.wx-app .me-chip { background: rgba(255, 255, 255, .035); border-color: var(--k-line-2); }
body.wx-app .me-ava {
  width: 40px; height: 40px; border-radius: 50%; overflow: visible; background: #0d0d10;
  box-shadow:
    0 0 0 1.5px rgba(255, 255, 255, .78),
    0 0 12px rgba(255, 255, 255, .42),
    0 0 22px rgba(255, 255, 255, .18);
}
body.wx-app .me-ava img {
  width: 100%; height: 100%; object-fit: cover; object-position: center center; border-radius: 50%;
  -webkit-mask-image: radial-gradient(circle at center, #000 0 97%, transparent 98.5%);
  mask-image: radial-gradient(circle at center, #000 0 97%, transparent 98.5%);
}
body.wx-app .me-photo { z-index: 1; }
body.wx-app .me-logo { z-index: 0; }
body.wx-app .me-ava:has(.me-photo:not([hidden])) .me-logo { display: none; }
body.wx-app .me-ava::before {
  content: ""; position: absolute; inset: -3px; z-index: 2; border-radius: 50%; pointer-events: none;
  background: conic-gradient(from 0deg, transparent 0 58%, rgba(255, 255, 255, .18) 74%, #fff 84%, rgba(255, 255, 255, .22) 92%, transparent 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.2px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.2px));
  animation: avaRim 4.2s linear infinite;
}
@keyframes avaRim { to { transform: rotate(1turn); } }
body.wx-app .me-logo,
.app .pf-astro { filter: none; }
body.wx-app .st-rk,
body.wx-app .rk-knob svg,
body.wx-app .range-rk,
body.wx-app .sp-ship { filter: drop-shadow(0 0 6px rgba(255, 171, 69, .25)); }
.is-mobile body.wx-app .brand-name,
html.is-mobile body.wx-app .brand-name { font-size: 27px; }
html.is-mobile body.wx-app .brand-rocket { display: block; width: auto; height: auto; }
html.is-mobile .hm-hero-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  column-gap: 6px;
  row-gap: 1px;
}
html.is-mobile .hm-hi { display: contents; }
html.is-mobile .hm-hi span {
  grid-column: 1; grid-row: 1; align-self: center;
  min-width: 0; overflow: hidden; text-overflow: ellipsis;
}
html.is-mobile .hm-hi b {
  grid-column: 1 / -1; grid-row: 2;
  min-width: 0; overflow: hidden; text-overflow: ellipsis;
}
html.is-mobile .hm-live {
  grid-column: 2; grid-row: 1;
  justify-self: end; align-self: center;
  height: 22px; padding: 0 6px; gap: 4px; font-size: 10px;
}
html.is-mobile .hm-hi { font-size: 13px; }
html.is-mobile body.wx-app .me-chip {
  width: 52px; height: 52px; min-width: 52px; padding: 0;
  justify-content: center; border: 0; border-radius: 50%; background: transparent;
}
html.is-mobile body.wx-app .me-ava { width: 46px; height: 46px; }

.app {
  font-family: "Manrope", system-ui, sans-serif;
  color: var(--k-text);
}
.app svg { flex: none; }

/* --- Подсветка карточек под пальцем и курсором --- */
.k-spot { position: relative; isolation: isolate; }
.k-spot::before,
.k-spot::after {
  content: ""; position: absolute; inset: 0; z-index: 0; border-radius: inherit; pointer-events: none;
  opacity: 0; transition: opacity .45s var(--k-ease);
}
.k-spot::before {
  padding: 1px;
  background: radial-gradient(320px circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .38), transparent 62%);
  -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);
}
.k-spot::after {
  background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .045), transparent 60%);
}
.k-spot.is-lit::before,
.k-spot.is-lit::after { opacity: 1; }
.k-spot > * { position: relative; z-index: 1; }

/* --- Верхняя плавающая планка навигации (ПК) --- */
.is-desktop .app {
  display: flex; flex-direction: column; gap: 20px;
  width: 100%; max-width: none; margin: 0;
}
.is-desktop .panes { width: 100%; min-width: 0; }
.is-desktop .wx-bar { display: none !important; }

.is-desktop .side {
  position: sticky; top: 76px; z-index: 35;
  display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; min-height: 56px; padding: 6px;
  border-radius: 18px;
  border: 1px solid var(--k-line);
  background: rgba(12, 12, 14, .82);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .05);
  backdrop-filter: blur(22px) saturate(120%);
  -webkit-backdrop-filter: blur(22px) saturate(120%);
}
html.in-tg-desk.is-desktop .side {
  top: calc(var(--tg-head, 68px) + 10px);
  height: auto;
  min-height: 56px;
  flex: none;
}
.is-desktop .side-nav { position: relative; display: flex; flex: 1; flex-direction: row; align-items: center; gap: 6px; flex-wrap: nowrap; min-width: 0; }
.is-desktop .side-nav::before { display: none !important; }
.is-desktop .side-nav button {
  position: relative; display: inline-flex; flex: 1 1 0; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  min-width: 0; height: 54px; padding: 6px 18px 5px; border-radius: 14px;
  color: var(--k-mute); font-size: 12.5px; font-weight: 700; line-height: 1; white-space: nowrap;
  transition: color .2s, background .2s;
}
.is-desktop .side-nav button::before { display: none !important; }
.is-desktop .side-nav button svg {
  display: block; flex: none; width: 22px; height: 22px; margin: 0; padding: 0; background: none; box-shadow: none;
  color: currentColor;
}
.is-desktop .side-nav button span {
  display: block; line-height: 13px; font-size: 12.5px;
}
.is-desktop .side-nav button[data-pane="chat"] svg {
  width: 17px; height: 17px; margin-block: 2.5px;
}
.is-desktop .side-nav button:hover { color: var(--k-text); background: rgba(255, 255, 255, .04); }
.is-desktop .side-nav button.is-on {
  color: var(--k-ink); font-weight: 800;
  background: var(--k-white);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .4), inset 0 1px 0 #fff;
}
.is-desktop .side-nav button.is-on svg { color: var(--k-ink); background: none; box-shadow: none; }

.is-desktop .side-foot { display: flex; flex-direction: row; align-items: center; gap: 6px; margin-top: 0; }
.is-desktop .side-card {
  position: relative; overflow: hidden;
  display: inline-flex; flex-direction: row; align-items: center; gap: 9px;
  width: auto; height: 42px; padding: 0 6px 0 13px; border-radius: 12px;
  border: 1px solid var(--k-line); background: rgba(255, 255, 255, .03);
  box-shadow: none;
  transition: border-color .2s, background .2s;
}
.is-desktop .side-card:hover { border-color: var(--k-line-3); background: rgba(255, 255, 255, .055); }
.side-card::after { display: none; }
.sc-top { display: contents; }
.sc-top > span { color: var(--k-mute); font-size: 10.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.is-desktop .side-card b {
  display: inline-flex; align-items: center; gap: 4px; margin: 0;
  color: #fff; font: 600 15px/1 var(--wx-head); letter-spacing: -.02em; font-variant-numeric: tabular-nums;
}
.is-desktop .side-card b .st-rk { width: 2.02cap; height: 2.02cap; margin: 0; }
.sc-plus {
  order: 4; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px;
  background: var(--k-white); color: var(--k-ink);
  font-size: 22px; font-weight: 700; font-style: normal; line-height: 1;
}
.sc-sub { display: none; }
.is-desktop .side-exit {
  position: relative;
  display: grid; place-items: center;
  width: 42px; height: 42px; padding: 0; border-radius: 12px;
  border: 1px solid rgba(255, 70, 102, .62);
  background: rgba(255, 36, 68, .1);
  color: #ff4d6d;
  font-size: 0 !important; line-height: 0;
  box-shadow: 0 0 12px rgba(255, 40, 72, .38), inset 0 0 10px rgba(255, 60, 90, .16);
  transition: color .2s, border-color .2s, background .2s, box-shadow .2s;
}
.is-desktop .side-exit svg {
  position: absolute; left: 50%; top: 50%; width: 22px; height: 22px; margin: 0;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 0 3px rgba(255, 70, 100, .95)) drop-shadow(0 0 7px rgba(255, 30, 60, .65));
}
.is-desktop .side-exit:hover {
  color: #ff8fa0;
  border-color: rgba(255, 130, 150, .8);
  background: rgba(255, 40, 70, .16);
  box-shadow: 0 0 16px rgba(255, 50, 80, .5), inset 0 0 12px rgba(255, 70, 100, .22);
}
@media (max-width: 1120px) {
  .is-desktop .side-nav button { padding: 5px 12px 4px; font-size: 12px; }
  .sc-top > span { display: none; }
}
@media (max-width: 1040px) {
  .is-desktop .side-nav { flex: 1; gap: 6px; }
  .is-desktop .side-nav button:not(.is-on) {
    flex: 1 1 0; width: auto; min-width: 52px; max-width: 84px; height: 42px;
    padding: 0; justify-content: center;
  }
  .is-desktop .side-nav button:not(.is-on) svg { width: 22px; height: 22px; }
  .is-desktop .side-nav button:not(.is-on) span {
    position: absolute; top: calc(100% + 8px); left: 50%; translate: -50% 4px; padding: 5px 9px; border-radius: 8px;
    background: #fff; color: var(--k-ink); font-size: 11.5px; font-weight: 800; white-space: nowrap;
    opacity: 0; pointer-events: none; transition: opacity .18s, translate .25s var(--k-ease);
  }
  .is-desktop .side-nav button:not(.is-on):hover span { opacity: 1; translate: -50% 0; }
  .is-desktop .side-nav button[data-pane="chat"] svg { width: 17px; height: 17px; margin-block: 2.5px; }
}

/* --- Общие поверхности и кнопки --- */
.app .card {
  border-radius: var(--k-r); border-color: var(--k-line);
  background: var(--k-card); box-shadow: var(--k-lift);
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
.app .btn { height: 50px; border-radius: 14px; font-weight: 800; font-size: 14.5px; letter-spacing: -.01em; }
.app .btn--sm { height: 38px; padding: 0 15px; border-radius: 11px; font-size: 13.5px; }
.app .btn--gold,
.pay-sheet .btn--gold {
  border: 0; color: var(--k-ink);
  background: var(--k-white);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .4), inset 0 1px 0 #fff;
}
.app .btn--gold:hover { filter: brightness(.96); box-shadow: 0 12px 28px rgba(0, 0, 0, .45), inset 0 1px 0 #fff; }
.app .btn--gold::after,
.app .btn--gold::before { display: none; }
.app .btn--glass { background: rgba(255, 255, 255, .035); border: 1px solid var(--k-line-2); color: var(--k-text); }
.app .btn--glass:hover { background: rgba(255, 255, 255, .07); border-color: var(--k-line-3); }
.app .btn--danger { background: rgba(251, 113, 133, .06); border: 1px solid rgba(251, 113, 133, .26); color: var(--k-bad); }
.app .btn:active,
.app .hm-primary:active,
.app .hm-seg > *:active,
.app .cab-row:active { transition-duration: .08s; }
.pane-head { margin-bottom: 16px; }
.app .pane-head h2 {
  font-family: var(--wx-head); font-weight: 600; letter-spacing: -.03em;
  color: #fff; background: none; -webkit-text-fill-color: #fff;
}
.app .pane-head p { color: var(--k-dim); }
.app .field { border-color: var(--k-line-2); background: var(--k-well); }
.app .field:focus-within { border-color: var(--k-line-3); box-shadow: 0 0 0 4px rgba(255, 255, 255, .05); }
.app .field input { color: #fff; }
.app .field input::placeholder { color: var(--k-mute); opacity: 1; }
.app .code-input { border-color: var(--k-line-2); background: var(--k-well); color: #fff; }
.app .link { color: #fff; text-decoration: underline; text-decoration-color: var(--k-line-3); text-underline-offset: 3px; }

/* --- Подписи секций --- */
.app .cab-label {
  display: flex; align-items: center; gap: 10px;
  margin: 22px 4px 10px; color: var(--k-mute);
  font-size: 10.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
}
.app .cab-label::before { display: none; }
.app .cab-label::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, var(--k-line), transparent); }

/* --- Списки и строки --- */
.cab-group {
  overflow: hidden; border-radius: var(--k-r-md);
  background: var(--k-card); border: 1px solid var(--k-line);
  box-shadow: var(--k-lift);
}
.cab-group > * + * { border-top: 1px solid rgba(255, 255, 255, .055); }
.cab-row {
  position: relative; display: flex; align-items: center; gap: 14px;
  width: 100%; min-height: 64px; padding: 12px 16px; text-align: left; color: inherit;
  background: transparent; transition: background .2s;
}
button.cab-row:active, a.cab-row:active { background: rgba(255, 255, 255, .045); }
.cab-ico, .cab-chev { transition: transform .35s var(--k-spring), background .2s, color .2s, border-color .2s; }
@media (hover: hover) {
  button.cab-row:hover, a.cab-row:hover { background: rgba(255, 255, 255, .025); }
  button.cab-row:hover .cab-chev, a.cab-row:hover .cab-chev { transform: translateX(3px); color: #fff; }
  button.cab-row:hover .cab-ico, a.cab-row:hover .cab-ico { color: #fff; border-color: var(--k-line-3); }
}
.cab-row.is-danger b { color: var(--k-bad); }
.cab-row.is-wait small { color: var(--k-mute); }

.cab-ico, .cab-alert-ico,
.cab-ico.is-gold, .cab-ico.is-cyan, .cab-ico.is-tg, .cab-ico.is-violet, .cab-ico.is-green, .cab-ico.is-red {
  position: relative; display: grid; place-items: center; flex: none;
  width: 40px; height: 40px; border-radius: 12px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .015));
  color: #d4d4d8;
  border: 1px solid var(--k-line-2);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}
.cab-ico svg, .cab-alert-ico svg { width: 19px; height: 19px; }
.cab-ico.is-red { color: var(--k-bad); }

.cab-main { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; padding: 0; text-align: left; background: none; border: 0; color: inherit; }
.cab-main b {
  overflow: hidden; color: var(--k-text); font-size: 14.5px; font-weight: 700; line-height: 1.25;
  letter-spacing: -.012em; text-overflow: ellipsis; white-space: nowrap;
}
.cab-main small {
  overflow: hidden; color: var(--k-mute); font-size: 12.5px; font-weight: 600; line-height: 1.3;
  text-overflow: ellipsis; white-space: nowrap;
}
.cab-main small .st-rk { width: 2.02cap; height: 2.02cap; }
.cab-main small.is-mono { color: var(--k-dim); font: 600 12px/1.3 ui-monospace, "SF Mono", Menlo, Consolas, monospace; }
.cab-main code { padding: 1px 6px; border-radius: 6px; background: rgba(255, 255, 255, .07); color: #fff; font-size: 11.5px; }

.cab-tools { display: flex; flex: none; gap: 6px; }
.cab-tool {
  display: grid; place-items: center; flex: none; width: 36px; height: 36px; padding: 0;
  border-radius: 10px; background: rgba(255, 255, 255, .035); border: 1px solid var(--k-line-2); color: #d4d4d8;
  transition: background .2s, border-color .2s, transform .16s, color .2s;
}
.cab-tool svg { width: 16px; height: 16px; }
.cab-tool:active { transform: scale(.92); }
@media (hover: hover) { .cab-tool:hover { background: rgba(255, 255, 255, .08); border-color: var(--k-line-3); color: #fff; } }
.cab-tool.is-sm { width: 28px; height: 28px; border-radius: 8px; }
.cab-tool.is-sm svg { width: 13px; height: 13px; }
.cab-chev { flex: none; width: 17px; height: 17px; color: var(--k-faint); }
.cab-pill {
  display: inline-flex; align-items: center; flex: none; height: 32px; padding: 0 14px;
  border-radius: 999px; border: 1px solid var(--k-line-2); background: rgba(255, 255, 255, .04); color: var(--k-text);
  font-size: 12.5px; font-weight: 800; white-space: nowrap;
  transition: background .2s, border-color .2s, transform .16s;
}
.cab-pill:active { transform: scale(.95); }
@media (hover: hover) { .cab-pill:hover { background: rgba(255, 255, 255, .09); border-color: var(--k-line-3); } }
.cab-pill.is-tg { border-color: transparent; background: var(--k-white); color: var(--k-ink); }
.cab-ok {
  display: grid; place-items: center; flex: none; width: 26px; height: 26px; border-radius: 50%;
  background: rgba(255, 255, 255, .06); color: #fff; border: 1px solid var(--k-line-2);
}
.cab-ok svg { width: 13px; height: 13px; }
.cab-row .rk-switch { flex: none; }

/* --- Баннеры --- */
.cab-promo {
  display: flex; align-items: center; gap: 14px; width: 100%; padding: 14px 16px; text-align: left;
  border-radius: var(--k-r-md); border: 1px solid var(--k-line); background: var(--k-card); box-shadow: var(--k-lift);
}
.cab-promo .cab-main small { white-space: normal; }
.cab-alert {
  display: flex; align-items: center; gap: 13px; width: 100%; margin-bottom: 14px; padding: 13px 16px; text-align: left;
  border-radius: var(--k-r-md); border: 1px solid var(--k-line-2);
  background: linear-gradient(90deg, rgba(251, 191, 36, .06), rgba(255, 255, 255, .015) 60%), var(--k-raised);
  box-shadow: var(--k-lift);
}
.cab-alert-ico { color: var(--k-warn); }
.cab-alert > span:nth-child(2) { flex: 1; min-width: 0; }
.cab-alert b { display: block; color: #fff; font-size: 14.5px; }
.cab-alert small { display: block; margin-top: 2px; color: var(--k-dim); font-size: 12px; font-weight: 600; }
.cab-alert em {
  flex: none; padding: 8px 14px; border-radius: 999px; background: var(--k-white); color: var(--k-ink);
  font-size: 12px; font-weight: 800; font-style: normal;
}

.cab-id {
  display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px;
  border-radius: 999px; background: rgba(255, 255, 255, .035); border: 1px solid var(--k-line-2);
  color: var(--k-dim); font-size: 11.5px; font-weight: 800; font-variant-numeric: tabular-nums;
  transition: background .2s, border-color .2s, color .2s;
}
.cab-id svg { width: 12px; height: 12px; color: var(--k-mute); }
@media (hover: hover) { .cab-id:hover { background: rgba(255, 255, 255, .07); border-color: var(--k-line-3); color: #fff; } }

.k-tip {
  position: fixed; z-index: 90; padding: 6px 12px; border-radius: 999px;
  background: var(--k-white); color: var(--k-ink); font: 800 12px/1 Manrope, sans-serif; letter-spacing: -.01em;
  white-space: nowrap; pointer-events: none;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .45), inset 0 1px 0 #fff;
}
.k-tip[hidden] { display: none; }
@keyframes kTip { from { opacity: 0; translate: 0 4px; } }
.k-tip:not([hidden]) { animation: kTip .16s var(--k-ease); }
@media (prefers-reduced-motion: reduce) { .k-tip:not([hidden]) { animation: none; } }

/* --- Раскрывашка --- */
.fold > .fold-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .34s var(--k-ease); }
.fold.is-open > .fold-body { grid-template-rows: 1fr; }
.fold-in { min-height: 0; overflow: hidden; }
.fold > .fold-body > .fold-in { opacity: 0; transition: opacity .18s; }
.fold.is-open > .fold-body > .fold-in { opacity: 1; transition: opacity .26s .06s; }

/* ============ Счётчик: стальной циферблат ============ */
.app .ring { cursor: pointer; -webkit-tap-highlight-color: transparent; outline: none; }
.app .ring:focus-visible { box-shadow: 0 0 0 2px rgba(255, 255, 255, .5); border-radius: 50%; }
.app .ring::before {
  inset: 26%;
  background: radial-gradient(circle at 50% 28%, #1d1d22 0%, #0c0c0f 62%, #070708 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .1),
    inset 0 -12px 22px rgba(0, 0, 0, .65),
    0 0 0 1px rgba(255, 255, 255, .07),
    0 18px 40px rgba(0, 0, 0, .7);
}
.app .ring::after { inset: 14%; background: radial-gradient(circle, rgba(255, 255, 255, .07), transparent 66%); animation: ringPulse 4.8s ease-in-out infinite; }
.app .ring.is-off::before { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 0 0 1px rgba(255, 255, 255, .07); }
.app .ring-svg circle { stroke-width: 4.2; }
.app .ring .ring-bg { stroke: rgba(255, 255, 255, .065); }
.app .ring .ring-fg { filter: drop-shadow(0 0 4px rgba(255, 255, 255, .45)); }
.app .ring .ring-glow { stroke-width: 12; opacity: .12; filter: blur(4px); }
.app .ring .ring-live { filter: none; }
.app .ring.is-off .ring-bg { stroke: transparent; }
.app .ring-ticks { fill: none; stroke: rgba(255, 255, 255, .13); stroke-width: .65; stroke-linecap: round; }
.app .ring-ticks.is-lit { stroke: rgba(255, 255, 255, .72); animation: ringTicks 1.6s var(--k-ease) both; }
.app .ring-orbit-line { stroke: rgba(255, 255, 255, .1); }
.app .ring-sat { border-color: rgba(255, 255, 255, .07); }
.app .ring-sat-out { border-color: rgba(255, 255, 255, .08); }
.app .ring-planet-a,
.app .ring-ell-arm i {
  background: radial-gradient(circle at 35% 32%, #fff, #c9c9cf 50%, #55555c);
  box-shadow: 0 0 7px rgba(255, 255, 255, .55);
}
.app .ring-planet-b,
.app .ring-ell-d .ring-ell-arm i {
  background: radial-gradient(circle at 35% 32%, #fafafa, #a1a1aa 58%, #3f3f46);
  box-shadow: 0 0 8px rgba(255, 255, 255, .4);
}
.app .ring-planet-b::before { border-color: rgba(255, 255, 255, .6); }
.app .ring-head i,
.app .ring-sat-empty i {
  background: radial-gradient(circle at 35% 35%, #fff, #f4f4f5 45%, #a1a1aa);
  box-shadow: 0 0 10px rgba(255, 255, 255, .9), 0 0 26px rgba(255, 255, 255, .35);
}
.app .ring-num { transition: opacity .35s var(--k-ease), transform .45s var(--k-ease), filter .35s; }
.app .ring-num b {
  color: #fff; font: 600 calc(var(--ring) * .2)/1 var(--wx-head); letter-spacing: 0;
  text-shadow: 0 0 24px rgba(255, 255, 255, .18);
}
.app .ring-num[data-digits="1"] b {
  font-family: "Baloo 2", var(--font-display);
  font-weight: 700;
  font-size: calc(var(--ring) * .26);
  line-height: 1;
  letter-spacing: 0;
}
.app .ring-num[data-digits="3"] b { font-size: calc(var(--ring) * .15); }
.app .ring-num span,
.app .ring.is-off .ring-num span {
  margin-top: calc(var(--ring) * .03); color: var(--k-mute);
  font-size: max(9px, calc(var(--ring) * .045)); font-weight: 800; letter-spacing: .2em;
}
.app .ring-exact {
  position: absolute; inset: 0; z-index: 2; display: grid; place-content: center; text-align: center; pointer-events: none;
  opacity: 0; transform: scale(1.12); filter: blur(6px);
  transition: opacity .35s var(--k-ease), transform .45s var(--k-ease), filter .35s;
}
.app .ring-exact b { color: #fff; font: 600 calc(var(--ring) * .15)/.95 var(--wx-head); letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.app .ring-exact span {
  margin-top: calc(var(--ring) * .035); color: var(--k-dim);
  font: 700 max(10px, calc(var(--ring) * .055))/1 ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-variant-numeric: tabular-nums; letter-spacing: .02em;
}
.app .ring.is-exact .ring-num { opacity: 0; transform: scale(.86); filter: blur(6px); }
.app .ring.is-exact .ring-exact { opacity: 1; transform: none; filter: none; }
.app .ring-flash { background: radial-gradient(circle, rgba(255, 255, 255, .55), rgba(255, 255, 255, .12) 38%, transparent 70%); }
.ring.is-still .ring-head,
.ring.is-still .ring-fg { transition: none; }
.ring.is-still .ring-ticks.is-lit { animation: none; }
@keyframes ringTicks { from { opacity: 0; } }

/* ============ Главная ============ */
.hm { display: grid; gap: 12px; }

.hm-hero {
  overflow: hidden;
  padding: 18px 18px 18px; border-radius: var(--k-r);
  border: 1px solid var(--k-line);
  background:
    radial-gradient(120% 70% at 50% 0%, rgba(255, 255, 255, .055), transparent 60%),
    var(--k-card);
  box-shadow: var(--k-lift);
}
.hm-hero-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.hm-hi {
  display: flex; flex: 1; flex-wrap: wrap; align-items: baseline; column-gap: .35em; row-gap: 1px;
  min-width: 0; margin: 0; color: var(--k-mute); font-size: 13px; font-weight: 700; line-height: 1.3;
}
.hm-hi span, .hm-hi b { white-space: nowrap; }
.hm-hi b { color: var(--k-text); font-weight: 800; }
.hm-live {
  display: inline-flex; align-items: center; gap: 7px; flex: none; height: 28px; padding: 0 11px;
  border-radius: 999px; border: 1px solid var(--k-line-2); background: rgba(255, 255, 255, .03);
  color: var(--k-dim); font-size: 11.5px; font-weight: 800; letter-spacing: .01em; white-space: nowrap;
}
.hm-live i {
  position: relative; display: block; flex: none; width: 8px; height: 8px; border-radius: 50%;
  background: var(--k-bad); font-style: normal; line-height: 0;
}
.hm-live.is-on { color: #fff; }
.hm-live.is-on i { background: var(--k-ok); }
.hm-live.is-on i::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px;
  border-radius: 50%; border: 1px solid var(--k-ok); translate: -50% -50%;
  transform-origin: center; pointer-events: none;
  animation: kPing 2.4s var(--k-ease) infinite;
}

.hm-hero-main { display: flex; flex-direction: column; align-items: center; gap: 4px; margin-top: 6px; text-align: center; }
.hm-orb { position: relative; display: grid; place-items: center; flex: none; }
.hm-hero .ring { --ring: 224px; margin: 0 auto; }
.hm-info { display: flex; flex-direction: column; align-items: center; width: 100%; min-width: 0; }
.hm-kicker { color: var(--k-mute); font-size: 10.5px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.hm-info h2 {
  margin: 8px 0 0; color: #fff; font: 600 clamp(24px, 6.6vw, 30px)/1.08 var(--wx-head);
  letter-spacing: -.04em;
}
.hm-info p { max-width: 34ch; margin: 8px 0 0; color: var(--k-dim); font-size: 13.5px; font-weight: 600; line-height: 1.45; }
.hm-info p .st-rk { width: 2.02cap; height: 2.02cap; }
.hm-facts {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; margin: 18px 0 0; padding: 14px 0 0;
  border-top: 1px solid var(--k-line);
}
.hm-facts > div { display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 0; padding: 0 6px; }
.hm-facts > div + div { position: relative; }
.hm-facts > div + div::before {
  content: ""; position: absolute; left: 0; top: 16px; bottom: 1px; width: 1px; background: var(--k-line);
}
.hm-facts dt { color: var(--k-mute); font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.hm-facts dd { display: flex; align-items: center; height: 22px; margin: 0; color: #fff; font: 600 19px/1 var(--wx-head); letter-spacing: -.03em; }
.hm-facts dd.hm-nolimit .sp-inf {
  display: block; width: 36px; height: 20px; overflow: visible;
  fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round;
}
.hm-traffic {
  display: grid; gap: 12px;
  padding: 16px;
  border-radius: var(--k-r); border: 1px solid var(--k-line);
  background: var(--k-card); box-shadow: var(--k-lift);
}
.hm-traffic-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.hm-traffic-free {
  padding: 4px 8px; border-radius: 999px; background: rgba(255, 255, 255, .06);
  color: #fff; font-size: 11px; font-weight: 800; letter-spacing: -.01em;
}
.hm-traffic-nums { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.hm-traffic-nums > div { display: grid; gap: 4px; min-width: 0; }
.hm-traffic-nums > div + div { padding-left: 12px; border-left: 1px solid var(--k-line); }
.hm-traffic-nums b {
  display: flex; align-items: baseline; gap: 0.22em;
  color: #fff; font: 750 clamp(22px, 5vw, 28px)/1 Manrope, var(--font), sans-serif; letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
}
.hm-traffic-nums b i {
  color: var(--k-mute); font-size: .48em; font-style: normal; font-weight: 700; letter-spacing: 0;
}
.hm-traffic-nums small { color: var(--k-mute); font-size: 12px; font-weight: 750; }
.hm-traffic p { margin: 0; color: var(--k-mute); font-size: 12.5px; font-weight: 650; line-height: 1.35; }

.hm-cta { display: grid; gap: 10px; margin-top: 18px; }
.hm-trial {
  display: flex; align-items: center; gap: 12px; width: 100%; min-width: 0;
  padding: 10px 10px 10px 12px; border-radius: 16px;
  border: 1px solid var(--k-line-2); background: rgba(255, 255, 255, .035);
  color: inherit; text-decoration: none; text-align: left;
}
.hm-trial-ico {
  display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 12px;
  border: 1px solid var(--k-line-2); background: rgba(255, 255, 255, .04); color: #fff;
}
.hm-trial-ico svg { width: 20px; height: 20px; }
.hm-trial-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.hm-trial-txt b { color: #fff; font-size: 14px; font-weight: 800; letter-spacing: -.01em; }
.hm-trial-txt small { color: var(--k-dim); font-size: 12px; font-weight: 600; }
.hm-trial em {
  display: inline-flex; align-items: center; flex: none; height: 32px; padding: 0 12px;
  border-radius: 999px; background: #fff; color: #111;
  font-size: 12.5px; font-weight: 800; font-style: normal;
}
@media (hover: hover) {
  .hm-trial:hover { border-color: var(--k-line-3); background: rgba(255, 255, 255, .06); }
}
.hm-primary {
  position: relative; overflow: hidden; isolation: isolate;
  display: flex; align-items: center; gap: 13px; width: 100%; min-height: 64px; padding: 10px 18px 10px 10px;
  border-radius: 18px; text-align: left; color: var(--k-ink);
  background: var(--k-white);
  box-shadow: 0 14px 30px -10px rgba(255, 255, 255, .18), 0 10px 24px rgba(0, 0, 0, .5), inset 0 1px 0 #fff;
  transition: transform .3s var(--k-spring), box-shadow .3s;
}
.hm-primary::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .95) 50%, transparent 62%);
  transform: translateX(-120%); animation: kSheen 6.5s var(--k-ease) 2s infinite;
}
.hm-primary:active { transform: scale(.98); }
.hm-primary-ico {
  display: grid; place-items: center; flex: none; width: 44px; height: 44px; border-radius: 13px;
  background: var(--k-ink); color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}
.hm-primary-ico svg { width: 21px; height: 21px; }
.hm-primary-txt { display: flex; flex: 1; flex-direction: column; gap: 2px; min-width: 0; }
.hm-primary-txt b { font-size: 15.5px; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; }
.hm-primary-txt small { color: #5d5d66; font-size: 12px; font-weight: 700; }
.hm-primary-go { width: 20px; height: 20px; color: var(--k-ink); transition: transform .35s var(--k-spring); }
@media (hover: hover) {
  .hm-primary:hover { transform: translateY(-1px); box-shadow: 0 18px 36px -10px rgba(255, 255, 255, .22), 0 12px 28px rgba(0, 0, 0, .55), inset 0 1px 0 #fff; }
  .hm-primary:hover .hm-primary-go { transform: translateX(4px); }
}

.hm-seg {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden; border-radius: 16px; border: 1px solid var(--k-line-2);
  background: rgba(255, 255, 255, .02);
}
.hm-seg > * {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  min-width: 0; height: 64px; padding: 0 6px; color: var(--k-dim); text-decoration: none;
  transition: background .2s, color .2s;
}
.hm-seg > * + * { border-left: 1px solid var(--k-line); }
.hm-seg svg { width: 20px; height: 20px; transition: transform .35s var(--k-spring); }
.hm-seg span { overflow: hidden; max-width: 100%; font-size: 12px; font-weight: 800; letter-spacing: -.005em; text-overflow: ellipsis; white-space: nowrap; }
.hm-seg > *:active { background: rgba(255, 255, 255, .05); }
.hm-seg > *:active svg { transform: scale(.88); }
@media (hover: hover) {
  .hm-seg > *:hover { color: #fff; background: rgba(255, 255, 255, .035); }
  .hm-seg > *:hover svg { transform: translateY(-2px); }
}

/* --- Баланс и устройства одной карточкой --- */
.hm-stats {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden; border-radius: var(--k-r); border: 1px solid var(--k-line);
  background: var(--k-card); box-shadow: var(--k-lift);
}
.hm-stat {
  display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 10px;
  min-width: 0; min-height: 132px; padding: 16px 16px 15px; text-align: left; color: inherit;
  transition: background .2s;
}
.hm-stat + .hm-stat { border-left: 1px solid var(--k-line); }
.hm-stat:active { background: rgba(255, 255, 255, .03); }
.hm-stat-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; }
.hm-stat-kicker { color: var(--k-mute); font-size: 10.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.hm-stat b {
  display: flex; align-items: center; gap: 7px; color: #fff;
  font: 600 clamp(26px, 7.4vw, 32px)/1 var(--wx-head); letter-spacing: -.05em;
  white-space: nowrap; font-variant-numeric: tabular-nums;
}
.k-frac { display: inline-flex; align-items: center; gap: 0.14em; line-height: 1; letter-spacing: 0; }
.k-frac > span,
.k-frac > i,
.k-frac > small {
  display: inline-flex; align-items: center; justify-content: center;
  margin: 0; line-height: 1; font-style: normal; letter-spacing: 0;
}
.k-frac > i { width: auto; transform: none; }
.hm-stat--dev b.k-frac { gap: 0.08em; }
.hm-stat b i { margin-left: 0; color: inherit; font-size: 1em; font-style: normal; letter-spacing: 0; }
.hm-stat b .st-rk { width: 2.02cap; height: 2.02cap; margin: 0; }
.hm-stat em { color: var(--k-mute); font-size: 12px; font-weight: 700; font-style: normal; }
.hm-plus,
.hm-stat-go {
  display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px;
  background: rgba(255, 255, 255, .04); border: 1px solid var(--k-line-2); color: var(--k-dim);
  transition: transform .35s var(--k-spring), color .2s, background .2s;
}
.hm-plus svg { width: 18px; height: 18px; }
.hm-stat-go .cab-chev { width: 14px; height: 14px; color: currentColor; }
@media (hover: hover) {
  .hm-stat:hover { background: rgba(255, 255, 255, .02); }
  .hm-stat:hover .hm-plus { transform: rotate(90deg); color: #fff; }
  .hm-stat:hover .hm-stat-go { transform: translateX(2px); color: #fff; }
}
.hm-slots { display: flex; align-items: center; gap: 6px; }
.hm-stat--dev { min-width: 0; overflow: hidden; }
.hm-slots.is-scroll {
  width: 100%; max-width: 100%; min-width: 0;
  overflow-x: auto; overflow-y: hidden; flex-wrap: nowrap;
  overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch;
  scrollbar-width: none; cursor: grab;
}
.hm-slots.is-scroll::-webkit-scrollbar { display: none; height: 0; }
.hm-slot {
  display: grid; place-items: center; flex: none; box-sizing: border-box; line-height: 0;
  width: 22px; height: 22px; border-radius: 7px;
  border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .04); color: #fff;
}
.hm-slot svg { width: 16px; height: 16px; margin: 0; display: block; justify-self: center; align-self: center; }

/* --- Карточки главной --- */
.hm-card {
  overflow: hidden;
  display: flex; flex-direction: column; gap: 14px; padding: 18px;
  border-radius: var(--k-r); border: 1px solid var(--k-line);
  background: var(--k-card); box-shadow: var(--k-lift);
}
.hm-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.hm-tag { color: var(--k-mute); font-size: 10.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.hm-head-link {
  display: inline-flex; align-items: center; gap: 2px; color: var(--k-dim); font-size: 12.5px; font-weight: 700;
  transition: color .2s;
}
.hm-head-link .cab-chev { width: 15px; height: 15px; color: currentColor; }
@media (hover: hover) { .hm-head-link:hover { color: #fff; } .hm-head-link:hover .cab-chev { transform: translateX(2px); } }

/* --- Ключ --- */
.hm-vault { display: flex; flex-direction: column; gap: 10px; }
.hm-vault.is-wait {
  flex-direction: row; align-items: center; gap: 14px; padding: 14px;
  border-radius: 14px; border: 1px dashed var(--k-line-2); background: var(--k-well);
}
.hm-vault-lock {
  display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 12px;
  border: 1px solid var(--k-line-2); color: var(--k-dim);
}
.hm-vault-lock svg { width: 18px; height: 18px; }
.hm-vault.is-wait .cab-main small { white-space: normal; }
.hm-vault-url {
  display: flex; flex-direction: column; align-items: stretch; gap: 8px;
  min-width: 0; padding: 0; background: none; border: 0; color: inherit; text-align: left;
}
.hm-vault-url small { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px; color: var(--k-mute); font-size: 12px; font-weight: 700; }
.hm-app-pair { display: inline-flex; align-items: center; gap: 3px; }
.hm-vault-url small img { width: 20px; height: 20px; border-radius: 5px; }
.hm-vault-url small img.hm-app-incy { width: auto; height: 13px; max-height: 13px; border-radius: 0; filter: grayscale(1) brightness(1.85); }
.hm-vault-url code {
  position: relative; display: block; overflow: hidden; padding: 13px 14px;
  border-radius: 12px; border: 1px solid var(--k-line); background: var(--k-well); color: #d4d4d8;
  font: 600 12.5px/1.3 ui-monospace, "SF Mono", Menlo, Consolas, monospace; letter-spacing: .01em;
  text-overflow: ellipsis; white-space: nowrap;
  -webkit-mask-image: linear-gradient(90deg, #000 78%, transparent);
  mask-image: linear-gradient(90deg, #000 78%, transparent);
  transition: border-color .25s, color .25s;
}
@media (hover: hover) { .hm-vault-url:hover code { border-color: var(--k-line-3); color: #fff; } }
.hm-vault-acts { display: grid; grid-template-columns: minmax(0, 1fr) 50px; gap: 8px; }
.hm-vbtn {
  position: relative; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  height: 48px; padding: 0 15px; border-radius: 14px;
  border: 1px solid var(--k-line-2); background: rgba(255, 255, 255, .035);
  color: var(--k-text); font-size: 13.5px; font-weight: 800;
  transition: transform .25s var(--k-spring), border-color .2s, background .2s;
}
.hm-vbtn svg { width: 18px; height: 18px; flex: none; fill: currentColor; stroke: none; }
.hm-vbtn:active { transform: scale(.96); }
.hm-vbtn.is-copy { border-color: transparent; background: var(--k-white); color: var(--k-ink); box-shadow: inset 0 1px 0 #fff; }
.hm-vbtn-ico { position: relative; display: grid; width: 18px; height: 18px; }
.hm-vbtn-ico svg { grid-area: 1 / 1; transition: opacity .2s, transform .35s var(--k-spring); }
.hm-vbtn-ico .is-b { opacity: 0; transform: scale(.4) rotate(-30deg); }
.hm-vbtn.is-done .hm-vbtn-ico .is-a { opacity: 0; transform: scale(.4) rotate(30deg); }
.hm-vbtn.is-done .hm-vbtn-ico .is-b { opacity: 1; transform: none; }
@media (hover: hover) { .hm-vbtn:not(.is-copy):hover { border-color: var(--k-line-3); background: rgba(255, 255, 255, .07); } }

.hm-auto {
  display: flex; align-items: center; gap: 14px; padding-top: 14px;
  border-top: 1px solid var(--k-line);
}
.hm-auto small .st-rk { margin-left: -0.18em; }

/* --- Автопродление: монохромный тумблер --- */
.app .rk-switch { padding: 3px; border-color: var(--k-line-2); background: rgba(255, 255, 255, .03); }
.app .rk-track { width: 66px; height: 32px; background: #0a0a0c; box-shadow: inset 0 1px 3px rgba(0, 0, 0, .7), inset 0 0 0 1px rgba(255, 255, 255, .07); }
.app .rk-track::before { background: linear-gradient(90deg, #3f3f46 0%, #d4d4d8 60%, #fafafa 100%); }
.app .rk-trail { background: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .35)); }
.app .rk-knob {
  top: 3px; left: 3px; width: 26px; height: 26px;
  background: radial-gradient(circle at 35% 30%, #2a2a30 0%, #121215 70%);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .14), 0 2px 6px rgba(0, 0, 0, .6);
}
.app .rk-knob svg { width: 23px; height: 23px; }
.app .rk-switch.is-on { border-color: var(--k-line-3); background: rgba(255, 255, 255, .06); box-shadow: 0 0 18px rgba(255, 255, 255, .08); }
.app .rk-switch.is-on .rk-knob { transform: translateX(34px); box-shadow: 0 0 0 1px rgba(0, 0, 0, .25), 0 3px 10px rgba(0, 0, 0, .55); }
.app .rk-switch.is-on .rk-stars i { background: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .55)); }

/* --- Локации --- */
.hm-count { display: inline-flex; align-items: center; gap: 7px; color: var(--k-dim); font-size: 12px; font-weight: 700; }
.hm-count i {
  position: relative; display: block; flex: none; width: 8px; height: 8px; border-radius: 50%;
  background: var(--k-ok); font-style: normal; line-height: 0;
}
.hm-count i::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px;
  border-radius: 50%; border: 1px solid var(--k-ok); translate: -50% -50%;
  transform-origin: center; pointer-events: none;
  animation: kPing 2.4s var(--k-ease) infinite .8s;
}
.hm-flags {
  position: relative; overflow: hidden; margin: 0 -18px; padding: 2px 0;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
}
.hm-flags-track { display: flex; gap: 8px; width: max-content; animation: cabMarquee 48s linear infinite; }
.hm-flags-track.is-desk { display: none; }
.hm-flags:hover .hm-flags-track,
.hm-flags.is-held .hm-flags-track { animation-play-state: paused; }
.hm-flags span {
  display: inline-flex; align-items: center; gap: 9px; height: 40px; padding: 0 18px 0 12px;
  border-radius: 12px; border: 1px solid var(--k-line); background: var(--k-well);
  color: var(--k-dim); font-size: 13.5px; font-weight: 700; white-space: nowrap;
  transition: color .3s, border-color .3s, background .3s;
}
.hm-flags i {
  width: 22px; height: 15px; flex: none; border-radius: 4px;
  background: center / cover no-repeat; box-shadow: 0 0 0 1px rgba(255, 255, 255, .14);
  filter: saturate(.8) brightness(.92);
  transition: filter .45s var(--k-ease);
}
.hm-flags span:hover,
.hm-flags span.is-on { color: #fff; border-color: var(--k-line-3); background: rgba(255, 255, 255, .04); }
.hm-flags span:hover i,
.hm-flags span.is-on i { filter: none; }
.hm-flags i[data-f="FI"] { background-image: url("/site/assets/flags/fi.png"); }
.hm-flags i[data-f="DE"] { background-image: url("/site/assets/flags/de.png"); }
.hm-flags i[data-f="NL"] { background-image: url("/site/assets/flags/nl.png"); }
.hm-flags i[data-f="LV"] { background-image: url("/site/assets/flags/lv.png"); }
.hm-flags i[data-f="SE"] { background-image: url("/site/assets/flags/se.png"); }
.hm-flags i[data-f="AT"] { background-image: url("/site/assets/flags/at.png"); }
.hm-flags i[data-f="EE"] { background-image: url("/site/assets/flags/ee.png"); }
.hm-flags i[data-f="PL"] { background-image: url("/site/assets/flags/pl.png"); }
.hm-flags i[data-f="ES"] { background-image: url("/site/assets/flags/es.png"); }
.hm-flags i[data-f="HR"] { background-image: url("/site/assets/flags/hr.png"); }
.hm-flags i[data-f="AL"] { background-image: url("/site/assets/flags/al.png"); }
.hm-flags i[data-f="TR"] { background-image: url("/site/assets/flags/tr.png"); }
.hm-flags i[data-f="KZ"] { background-image: url("/site/assets/flags/kz.png"); }
.hm-flags i[data-f="US"] { background-image: url("/site/assets/flags/us.png"); }
.hm-flags i[data-f="BR"] { background-image: url("/site/assets/flags/br.png"); }
.hm-flags i[data-f="RU"] { background-image: url("/site/assets/flags/ru.png"); }
@keyframes cabMarquee { to { transform: translateX(calc(-50% - 4px)); } }

.hm-tile-badge {
  flex: none; padding: 4px 9px; border-radius: 999px;
  background: rgba(255, 171, 69, .08); border: 1px solid rgba(255, 171, 69, .32);
  color: #ffc77a; font-size: 11.5px; font-weight: 800; font-style: normal; font-variant-numeric: tabular-nums;
}
.hm-promos { display: grid; gap: 10px; }

@media (min-width: 900px) {
  .is-desktop .hm {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 16px; align-items: stretch;
  }
  .is-desktop .hm > .cab-alert { grid-column: 1 / -1; }
  .is-desktop .hm-hero { grid-column: 1 / 8; grid-row: 1 / 3; padding: 24px 26px 24px; display: flex; flex-direction: column; }
  .is-desktop .hm-hero-main { flex: 1; flex-direction: row; align-items: center; justify-content: flex-start; gap: 34px; margin-top: 10px; text-align: left; }
  .is-desktop .hm-hero .ring { --ring: clamp(188px, 18vw, 236px); }
  .is-desktop .hm-info { align-items: flex-start; }
  .is-desktop .hm-info h2 { font-size: clamp(26px, 2.2vw, 32px); }
  .is-desktop .hm-facts > div { align-items: flex-start; padding-left: 16px; }
  .is-desktop .hm-facts > div:first-child { padding-left: 0; }
  .is-desktop .hm-cta { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: stretch; margin-top: 22px; }
  .is-desktop .hm-cta .hm-trial { grid-column: 1 / -1; }
  .is-desktop .hm-seg > * { height: auto; min-height: 64px; }
  .is-desktop .hm-stats { grid-column: 8 / -1; grid-row: 1; }
  .is-desktop .hm-key { grid-column: 8 / -1; grid-row: 2; }
  .is-desktop .hm-quick { grid-column: 1 / 8; grid-row: 3; display: flex; flex-direction: column; min-height: 100%; }
  .is-desktop .hm-links { grid-column: 8 / -1; grid-row: 3; }
  .is-desktop .hm-quick .hm-flags {
    flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: 8px;
    margin: 0 -18px; padding: 0; overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 2%, #000 98%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 2%, #000 98%, transparent);
  }
  .is-desktop .hm-quick .hm-flags-track:not(.is-desk) { display: none; }
  .is-desktop .hm-quick .hm-flags-track.is-desk { display: flex; gap: 8px; width: max-content; animation: cabMarquee 46s linear infinite; }
  .is-desktop .hm-quick .hm-flags-track.is-back { animation-duration: 58s; animation-direction: reverse; }
  .is-desktop .hm-quick .hm-flags-track.is-slow { animation-duration: 52s; }
  .is-desktop .hm-quick .hm-flags span { flex: none; overflow: visible; text-overflow: clip; }
  .is-desktop .hm-links { grid-column: 8 / -1; grid-row: 3; }
  .is-desktop .hm-promos { grid-column: 1 / -1; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
  .is-desktop .hm-promos .cab-group { grid-column: 1 / -1; }
}
@media (min-width: 900px) and (max-width: 1180px) {
  .is-desktop .hm-hero { padding: 18px 20px; }
  .is-desktop .hm-hero-main { gap: 20px; }
  .is-desktop .hm-hero .ring { --ring: clamp(168px, 16vw, 200px); }
  .is-desktop .hm-info h2 { font-size: clamp(22px, 2.1vw, 26px); white-space: nowrap; }
  .is-desktop .hm-info p { font-size: 13px; }
  .is-desktop .hm-facts dd { font-size: 17px; }
  .is-desktop .hm-cta { grid-template-columns: 1fr; margin-top: 16px; }
  .is-desktop .hm-primary { min-height: 56px; }
  .is-desktop .hm-primary-ico { width: 38px; height: 38px; }
  .is-desktop .hm-primary-ico svg { width: 18px; height: 18px; }
  .is-desktop .hm-primary-txt b { font-size: 14.5px; }
  .is-desktop .hm-seg > * { min-height: 52px; }
  .is-desktop .hm-seg svg { width: 18px; height: 18px; }
  .is-desktop .hm-stat { min-height: 116px; padding: 14px; }
  .is-desktop .hm-stat b { font-size: 26px; }
  .is-desktop .side-nav button { height: 52px; padding: 5px 14px 4px; font-size: 12px; }
  .is-desktop .cab-ico { width: 36px; height: 36px; }
  .is-desktop .cab-ico svg { width: 17px; height: 17px; }
}

/* --- Окно QR --- */
.cab-sheet {
  position: fixed; inset: 0; z-index: 90; display: grid; align-items: end; justify-items: center;
  visibility: hidden; pointer-events: none; transition: visibility 0s .36s;
}
.cab-sheet.is-on { visibility: visible; pointer-events: auto; transition-delay: 0s; }
.cab-sheet-back {
  position: absolute; inset: 0; width: 100%; padding: 0; border: 0;
  background: rgba(0, 0, 0, .72); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  opacity: 0; transition: opacity .3s;
}
.cab-sheet.is-on .cab-sheet-back { opacity: 1; }
.cab-sheet-card {
  position: relative; width: min(440px, 100%); padding: 28px 20px calc(20px + var(--safe-b, 0px));
  border-radius: 26px 26px 0 0; background: #0e0e11;
  border: 1px solid var(--k-line-2); border-bottom: 0;
  text-align: center; transform: translateY(104%); transition: transform .4s var(--k-ease);
}
.cab-sheet.is-on .cab-sheet-card { transform: none; }
.cab-sheet-card::before { content: ""; position: absolute; top: 9px; left: 50%; width: 38px; height: 4px; margin-left: -19px; border-radius: 3px; background: rgba(255, 255, 255, .16); }
.cab-sheet-card h3 { color: #fff; font: 600 19px/1.2 var(--wx-head); letter-spacing: -.03em; }
.cab-sheet-card p { margin: 8px auto 18px; max-width: 300px; color: var(--k-dim); font-size: 13.5px; line-height: 1.45; }
.cab-sheet-x {
  position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 34px; height: 34px;
  padding: 0; border-radius: 50%; background: rgba(255, 255, 255, .06); border: 1px solid var(--k-line); color: #fff;
}
.cab-sheet-x svg { width: 15px; height: 15px; }
.cab-sheet-qr {
  position: relative; width: 224px; height: 224px; margin: 0 auto 18px; padding: 12px; border-radius: 20px; background: #fff;
  box-shadow: 0 0 0 6px rgba(255, 255, 255, .04), 0 20px 40px rgba(0, 0, 0, .6);
}
.cab-sheet-qr svg { display: block; width: 100%; height: 100%; }
.is-desktop .cab-sheet { align-items: center; }
.is-desktop .cab-sheet-card { padding: 32px 26px 24px; border-radius: 24px; border-bottom: 1px solid var(--k-line-2); opacity: 0; transform: translateY(14px) scale(.97); transition: transform .32s var(--k-ease), opacity .22s; }
.is-desktop .cab-sheet.is-on .cab-sheet-card { opacity: 1; transform: none; }
.is-desktop .cab-sheet-card::before { display: none; }

/* --- Первый визит: тестовый день за Telegram --- */
.tg-hello {
  position: fixed; inset: 0; z-index: 220; display: grid; place-items: center; padding: 18px;
  visibility: hidden; pointer-events: none;
}
.tg-hello.is-on { visibility: visible; pointer-events: auto; }
body:has(.tg-hello.is-on) { overflow: hidden; }
.tg-hello-back {
  position: absolute; inset: 0; padding: 0; border: 0;
  background: rgba(0, 0, 0, .72); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  opacity: 0; transition: opacity .35s;
}
.tg-hello.is-on .tg-hello-back { opacity: 1; }
.tg-hello-card {
  position: relative; width: min(400px, 100%); max-height: min(640px, calc(100vh - 36px)); overflow: auto;
  padding: 0 22px 16px; border-radius: 28px; text-align: center;
  background: #0e0e11; border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 30px 80px rgba(0, 0, 0, .65), inset 0 1px 0 rgba(255, 255, 255, .08);
  opacity: 0; transform: translateY(18px) scale(.96);
}
.tg-hello.is-on .tg-hello-card { opacity: 1; transform: none; transition: transform .5s var(--k-ease), opacity .35s; }
.tg-hello-x {
  position: absolute; top: 12px; right: 12px; z-index: 2; display: grid; place-items: center;
  width: 34px; height: 34px; padding: 0; border-radius: 50%;
  background: rgba(8, 8, 10, .55); border: 1px solid rgba(255, 255, 255, .16); color: #fff;
}
.tg-hello-x svg { width: 15px; height: 15px; }
.tg-hello-sky {
  position: relative; height: 168px; margin: 0 -22px 16px; overflow: hidden; border-radius: 28px 28px 0 0;
  background:
    radial-gradient(140px 90px at 50% 120%, rgba(255, 171, 69, .28), transparent 70%),
    radial-gradient(80% 70% at 50% 0%, rgba(255, 255, 255, .07), transparent 62%),
    #09090b;
}
.tg-hello-sky > i {
  position: absolute; width: 2px; height: 2px; border-radius: 50%; background: #fff;
  box-shadow: 0 0 6px #fff; animation: tgStar 2.8s ease-in-out infinite;
}
.tg-hello-sky > i:nth-child(1) { top: 22px; left: 18%; animation-delay: .2s; }
.tg-hello-sky > i:nth-child(2) { top: 48px; left: 78%; width: 3px; height: 3px; animation-delay: .8s; }
.tg-hello-sky > i:nth-child(3) { top: 78px; left: 12%; animation-delay: 1.4s; }
.tg-hello-sky > i:nth-child(4) { top: 30px; left: 62%; animation-delay: .4s; }
.tg-hello-sky > i:nth-child(5) { top: 96px; left: 84%; animation-delay: 1.1s; }
.tg-hello-sky > i:nth-child(6) { top: 58px; left: 30%; width: 1px; height: 1px; animation-delay: 1.8s; }
@keyframes tgStar { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
.tg-hello-orbit {
  position: absolute; left: 50%; top: 54%; width: 132px; height: 132px; border-radius: 50%;
  border: 1px dashed rgba(255, 255, 255, .22); transform: translate(-50%, -50%);
  animation: tgOrbit 18s linear infinite;
}
.tg-hello-orbit::after {
  content: ""; position: absolute; top: -3px; left: 50%; width: 6px; height: 6px; border-radius: 50%;
  background: #ffc56a; box-shadow: 0 0 8px #ffab45;
}
@keyframes tgOrbit { to { transform: translate(-50%, -50%) rotate(360deg); } }
.tg-hello-sky img {
  position: absolute; left: 50%; top: 54%; width: 108px; height: 108px;
  border-radius: 50%; object-fit: cover; transform: translate(-50%, -50%);
}
.tg-hello-fly {
  position: absolute; left: -28px; bottom: 28px; width: 22px; height: 22px; margin: 0;
  animation: tgFly 2.8s var(--k-ease) .35s both;
}
@keyframes tgFly {
  0% { left: -28px; opacity: 0; }
  18% { opacity: 1; }
  100% { left: calc(100% + 20px); opacity: 0; }
}
.tg-hello-kicker {
  display: inline-flex; align-items: center; gap: 7px; margin: 0;
  color: var(--k-mute); font-size: 10.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase;
}
.tg-hello-kicker i { width: 8px; height: 8px; border-radius: 50%; background: var(--k-ok); box-shadow: 0 0 0 4px rgba(74, 222, 128, .12); }
.tg-hello-card h2 {
  margin: 8px 0 0; color: #fff; font: 600 clamp(22px, 6vw, 26px)/1.05 var(--wx-head); letter-spacing: -.04em;
}
.tg-hello-card > p { margin: 8px auto 0; max-width: 32ch; color: var(--k-dim); font-size: 14px; line-height: 1.45; }
.tg-hello-day {
  display: flex; align-items: center; gap: 12px; margin: 16px 0 12px; padding: 10px 12px 10px 14px;
  border-radius: 18px; border: 1px solid rgba(255, 197, 106, .35);
  background: linear-gradient(90deg, rgba(255, 171, 69, .12), rgba(255, 255, 255, .03));
  text-align: left;
}
.tg-hello-day b {
  flex: none; color: #ffc56a; font: 700 40px/1 "Baloo 2", Manrope, sans-serif; letter-spacing: -.03em;
  text-shadow: 0 0 16px rgba(255, 171, 69, .45);
}
.tg-hello-day span { display: flex; flex: 1; flex-direction: column; gap: 2px; color: #fff; font-size: 15px; font-weight: 800; }
.tg-hello-day small { color: var(--k-mute); font-size: 12px; font-weight: 600; }
.tg-hello-day .st-rk { width: 28px; height: 28px; margin: 0; flex: none; }
.tg-hello-perks { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 0 0 16px; padding: 0; list-style: none; }
.tg-hello-perks li {
  padding: 6px 10px; border-radius: 999px; border: 1px solid var(--k-line-2);
  background: rgba(255, 255, 255, .04); color: var(--k-text); font-size: 12px; font-weight: 700;
}
.tg-hello-go {
  display: flex; align-items: center; justify-content: center; gap: 8px; height: 50px;
  border-radius: 16px; background: var(--k-white); color: var(--k-ink);
  font-size: 15px; font-weight: 800;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .4), inset 0 1px 0 #fff;
}
.tg-hello-go svg { width: 18px; height: 18px; color: var(--k-ink); }
.tg-hello-later {
  display: block; width: 100%; margin-top: 8px; padding: 8px; background: none; border: 0;
  color: var(--k-mute); font-size: 13px; font-weight: 700;
}
@media (prefers-reduced-motion: reduce) {
  .tg-hello-sky > i, .tg-hello-orbit, .tg-hello-fly { animation: none; }
  .tg-hello-fly { display: none; }
}

/* ============ Профиль ============ */
.pf-grid { display: grid; gap: 12px; }
.pf-col { min-width: 0; }
.app .pf-head {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; gap: 18px; padding: 20px;
  border-radius: var(--k-r); border: 1px solid var(--k-line);
  background: radial-gradient(120% 80% at 0% 0%, rgba(255, 255, 255, .05), transparent 55%), var(--k-card);
  box-shadow: var(--k-lift);
}
.pf-app { margin-top: 0; }
.pf-app-card {
  display: grid; gap: 14px; padding: 16px;
  border-radius: var(--k-r); border: 1px solid var(--k-line);
  background: var(--k-card); box-shadow: var(--k-lift);
}
.pf-app-head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pf-app-head img { width: 44px; height: 44px; border-radius: 14px; object-fit: cover; flex: none; }
.pf-app-head b { display: block; color: #fff; font-size: 16px; font-weight: 800; letter-spacing: -.02em; }
.pf-app-head small { display: block; margin-top: 2px; color: var(--k-mute); font-size: 12px; font-weight: 650; }
.pf-app-card ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.pf-app-card li {
  display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: start;
  color: #fff; font-size: 14px; font-weight: 650; line-height: 1.35;
}
.pf-app-card li span {
  display: grid; place-items: center; width: 22px; height: 22px; margin-top: 1px;
  border-radius: 50%; background: rgba(255, 255, 255, .08);
  color: #fff; font-size: 12px; font-weight: 800;
}
.pf-app-apk {
  display: flex; align-items: center; justify-content: center; height: 44px; margin-top: 2px;
  border-radius: 14px; border: 1px solid var(--k-line-2); background: rgba(255, 255, 255, .04);
  color: #fff; font-weight: 800;
}
.pf-head-top { display: flex; align-items: center; gap: 16px; min-width: 0; }
.app .pf-ava {
  position: relative; display: grid; place-items: center; flex: none;
  width: 68px; height: 68px; border-radius: 50%; overflow: visible; background: #0d0d10;
  box-shadow:
    0 0 0 1.5px rgba(255, 255, 255, .72),
    0 0 16px rgba(255, 255, 255, .28),
    0 12px 26px rgba(0, 0, 0, .55);
}
.pf-ava img {
  position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; border-radius: 50%;
  object-fit: cover; object-position: center center;
  -webkit-mask-image: radial-gradient(circle at center, #000 0 97%, transparent 98.5%);
  mask-image: radial-gradient(circle at center, #000 0 97%, transparent 98.5%);
}
.app .pf-ava::before {
  content: ""; position: absolute; inset: -3px; z-index: 2; border-radius: 50%; pointer-events: none;
  background: conic-gradient(from 0deg, transparent 0 58%, rgba(255, 255, 255, .18) 74%, #fff 84%, rgba(255, 255, 255, .22) 92%, transparent 100%);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.2px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.2px));
  animation: avaRim 4.2s linear infinite;
}
.pf-ava img.pf-astro { z-index: 0; }
.pf-who { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; min-width: 0; }
.pf-role { display: inline-flex; align-items: center; gap: 7px; color: var(--k-mute); font-size: 10.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.pf-role i { display: block; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--k-ok); font-style: normal; line-height: 0; }
.pf-who h2 {
  max-width: 100%; overflow: hidden; margin: 0; color: #fff;
  font: 600 clamp(21px, 2.2vw, 25px)/1.1 var(--wx-head); letter-spacing: -.04em;
  text-overflow: ellipsis; white-space: nowrap;
}
.pf-pills {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden; border-radius: 16px; border: 1px solid var(--k-line); background: var(--k-well);
}
.pf-pills button {
  display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
  min-width: 0; padding: 13px 14px; text-align: left; transition: background .2s;
}
.pf-pills button + button { border-left: 1px solid var(--k-line); }
@media (hover: hover) { .pf-pills button:hover { background: rgba(255, 255, 255, .03); } }
.pf-pills small { color: var(--k-mute); font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.pf-pills b {
  display: flex; align-items: center; gap: 4px; max-width: 100%; overflow: hidden;
  color: #fff; font-size: 14px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap;
}
.pf-pills b.k-frac { gap: 0.16em; font-variant-numeric: tabular-nums; }
.pf-pills b .st-rk { width: 2.02cap; height: 2.02cap; margin: 0; flex: none; }
.pf-out { margin-top: 12px; }
.cab-form { display: grid; gap: 10px; padding: 2px 16px 16px; }
.cab-form .field input { font-size: 16px; }
.cab-form .code-box, .cab-form .form-err { margin: 0; }

@media (min-width: 960px) {
  .is-desktop .pf-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
  .is-desktop .pf-head, .is-desktop .hm-traffic { grid-column: 1 / -1; }
  .is-desktop .pf-head { flex-direction: row; align-items: center; justify-content: space-between; padding: 22px 24px; }
  .is-desktop .pf-pills { min-width: 460px; }
}
@media (max-width: 420px) {
  .pf-pills { grid-template-columns: 1fr; }
  .pf-pills button { flex-direction: row; align-items: center; justify-content: space-between; }
  .pf-pills button + button { border-left: 0; border-top: 1px solid var(--k-line); }
}

/* --- История платежей --- */
.ph { overflow: hidden; border-radius: var(--k-r-md); border: 1px solid var(--k-line); background: var(--k-card); box-shadow: var(--k-lift); }
.ph-head { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 66px; padding: 12px 16px; text-align: left; }
.ph-last { flex: none; color: #fff; font-size: 14px; font-weight: 800; font-variant-numeric: tabular-nums; transition: opacity .2s; }
.ph-chev { flex: none; width: 18px; height: 18px; color: var(--k-faint); transition: transform .34s var(--k-ease); }
.ph.is-open > .ph-head .ph-chev { transform: rotate(180deg); }
.ph.is-open > .ph-head .ph-last { opacity: 0; }
.ph-list { border-top: 1px solid var(--k-line); }
.ph-item + .ph-item { border-top: 1px solid rgba(255, 255, 255, .05); }
.ph-line { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 16px; text-align: left; transition: background .2s; }
.ph-item.is-open > .ph-line { background: rgba(255, 255, 255, .02); }
.ph-ico,
.ph-item.is-paid .ph-ico {
  display: grid; place-items: center; flex: none; width: 34px; height: 34px; border-radius: 10px;
  background: rgba(255, 255, 255, .04); color: var(--k-dim); border: 1px solid var(--k-line-2);
}
.ph-item.is-paid .ph-ico { color: #fff; }
.ph-ico svg { width: 15px; height: 15px; }
.ph-sum { display: flex; flex: none; flex-direction: column; align-items: flex-end; gap: 2px; }
.ph-sum b { color: #fff; font-size: 14px; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ph-sum small { color: var(--k-warn); font-size: 11px; font-weight: 700; white-space: nowrap; }
.ph-item.is-paid .ph-sum b { color: #fff; }
.ph-item.is-out .ph-sum b { color: var(--k-dim); }
.ph-item.is-paid .ph-sum small { color: var(--k-mute); }
.ph-dl { margin: 0 14px 14px; padding: 2px 12px; border-radius: 12px; background: var(--k-well); border: 1px solid var(--k-line); }
.ph-dl > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 42px; }
.ph-dl > div + div { border-top: 1px solid rgba(255, 255, 255, .05); }
.ph-dl dt { flex: none; color: var(--k-mute); font-size: 12px; font-weight: 700; }
.ph-dl dd { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; margin: 0; color: #fff; font-size: 12.5px; font-weight: 700; }
.ph-dl dd > span, .ph-dl dd > code { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ph-dl code { color: var(--k-dim); font: 600 12px/1.3 ui-monospace, "SF Mono", Menlo, Consolas, monospace; }
.ph-dl .is-ok { color: var(--k-ok); }
.ph-dl .is-wait { color: var(--k-warn); }
.ph-more { display: block; width: 100%; height: 46px; border-top: 1px solid var(--k-line); color: var(--k-text); font-size: 13px; font-weight: 800; }
.ph-empty { padding: 18px 14px; color: var(--k-mute); font-size: 13px; text-align: center; }

/* ============ Устройства ============ */
.dv-sum {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  margin: 0 0 12px; padding: 16px 18px; border-radius: var(--k-r-md);
  border: 1px solid var(--k-line); background: var(--k-card); box-shadow: var(--k-lift);
}
.dv-sum b { color: #fff; font: 600 24px/1 var(--wx-head); letter-spacing: -.05em; white-space: nowrap; }
.dv-sum b.k-frac { gap: 0.28em; letter-spacing: 0; }
.dv-sum b.k-frac small { color: var(--k-mute); font-size: 0.58em; font-weight: 700; letter-spacing: 0; }
.dv-meter { display: flex; flex: 1; gap: 4px; max-width: 280px; }
.dv-meter i { flex: 1; height: 4px; border-radius: 999px; background: rgba(255, 255, 255, .08); }
.dv-meter i.is-on { background: #fff; box-shadow: 0 0 10px rgba(255, 255, 255, .3); }
#pane-devices .dv-board {
  display: block; overflow: hidden; gap: 0; padding: 0;
  border-radius: var(--k-r); border: 1px solid var(--k-line); background: var(--k-card); box-shadow: var(--k-lift);
}
#pane-devices .dv-board > * + * { border-top: 1px solid rgba(255, 255, 255, .055); }
#pane-devices .dev-slot.dv-row,
.is-mobile #pane-devices .dev-slot.dv-row {
  display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 14px;
  padding: 14px 16px; border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
#pane-devices .dev-slot.dv-row + .dev-slot.dv-row { border-top: 1px solid rgba(255, 255, 255, .055); }
#pane-devices .dev-slot.dv-row .dev-os,
#pane-devices .dev-os[class*="is-"] {
  position: relative; width: 44px; height: 44px; align-self: center; border-radius: 13px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .015));
  border: 1px solid var(--k-line-2); color: #e4e4e7; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}
#pane-devices .dev-os svg { width: 20px; height: 20px; color: #fff; filter: none; }
#pane-devices .dev-os svg.os-logo { width: 21px; height: 21px; color: #fff; }
.hp-dev-tabs svg.os-logo { width: 16px; height: 16px; }
#pane-devices .dev-slot.dv-row .dev-actions,
.is-mobile #pane-devices .dev-slot.dv-row .dev-actions { grid-column: 3; grid-row: 1; flex-direction: row; width: auto; margin: 0; gap: 6px; }
#pane-devices .dev-slot.dv-row strong { color: #fff; font-size: 14.5px; letter-spacing: -.01em; }
#pane-devices .dv-acts button { min-height: 0; }
#pane-devices .dev-slot.dv-row:has(.dev-name) { grid-template-columns: 44px minmax(0, 1fr); }
#pane-devices .dev-slot.dv-row:has(.dev-name) .dv-acts { display: none; }
.dv-dot { position: absolute; right: -2px; bottom: -2px; width: 11px; height: 11px; border-radius: 50%; background: var(--k-ok); box-shadow: 0 0 0 3px #0c0c0e; }
.dv-meta { display: block; margin-top: 3px; overflow: hidden; color: var(--k-dim); font-size: 12px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.dv-seen { display: block; margin-top: 2px; color: var(--k-mute); font-size: 11.5px; font-weight: 600; }
.dv-seen.is-live { color: var(--k-ok); }
.dv-added { display: block; margin-top: 1px; color: var(--k-faint); font-size: 11.5px; font-weight: 600; }
.dv-acts button {
  display: grid; place-items: center; flex: none; width: 36px; height: 36px; min-height: 0; padding: 0;
  border-radius: 10px; border: 1px solid var(--k-line-2); background: rgba(255, 255, 255, .03); color: #d4d4d8;
  transition: background .2s, border-color .2s, color .2s, transform .16s;
}
.dv-acts button:active { transform: scale(.92); }
.dv-acts button svg { width: 16px; height: 16px; }
.dv-acts .is-danger,
#pane-devices .dv-acts .is-danger {
  color: var(--k-mute);
  border-color: var(--k-line-2);
  background: rgba(255, 255, 255, .03);
  box-shadow: none;
}
#pane-devices .dv-acts .is-danger:active {
  color: var(--k-bad);
  border-color: rgba(251, 113, 133, .35);
  background: rgba(251, 113, 133, .08);
}
#pane-devices .dev-ask-keep {
  border: 1px solid var(--k-line-2);
  background: rgba(255, 255, 255, .04);
  color: #fff;
  box-shadow: none;
}
#pane-devices .dev-ask-drop {
  border: 1px solid rgba(251, 113, 133, .28);
  background: transparent;
  color: #fb7185;
  box-shadow: none;
}
#pane-devices .dev-ask-drop:active { background: rgba(251, 113, 133, .1); }
@media (hover: hover) {
  .dv-acts button:hover { background: rgba(255, 255, 255, .07); border-color: var(--k-line-3); color: #fff; }
  .dv-acts .is-danger:hover { color: var(--k-bad); border-color: rgba(251, 113, 133, .3); background: rgba(251, 113, 133, .06); }
}
.dv-row .dev-copy > div { display: flex; gap: 6px; margin-top: 2px; }
.dv-row .dev-name { flex: 1; min-width: 0; height: 38px; padding: 0 11px; border-radius: 10px; border: 1px solid var(--k-line-3); background: var(--k-well); color: #fff; font-size: 15px; }
.dv-row .dev-save { flex: none; height: 38px; padding: 0 13px; border-radius: 10px; background: var(--k-white); color: var(--k-ink); font-weight: 800; }
.dv-free { display: flex; align-items: center; gap: 14px; width: 100%; padding: 14px 16px; text-align: left; transition: background .2s; }
@media (hover: hover) { .dv-free:hover { background: rgba(255, 255, 255, .02); } }
.dv-free-ico {
  display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 13px;
  border: 1px dashed var(--k-line-3); background: transparent;
  color: var(--k-dim); font-size: 26px; font-weight: 500; line-height: 1;
}
.dv-free b { display: block; color: #fff; font-size: 14px; }
.dv-free small { display: block; margin-top: 2px; color: var(--k-mute); font-size: 12px; font-weight: 600; }
.dv-full, .dv-empty { padding: 18px 16px; color: var(--k-mute); font-size: 13px; text-align: center; }

/* ============ Подключить, Тарифы, Помощь, Партнёрка ============ */
.is-desktop #pane-profile { max-width: none; margin-inline: 0; }
.is-desktop #pane-connect,
.is-desktop #pane-plans,
.is-desktop #pane-devices {
  width: min(760px, 100%);
  max-width: 760px;
  margin-inline: auto;
}
.is-desktop #pane-chat {
  width: min(980px, 100%);
  max-width: 980px;
  margin-inline: auto;
}
#pane-plans .shop { max-width: none; margin-inline: 0; display: grid; gap: 12px; }

#pane-connect.port-screen {
  --sp-gold: #f5f5f6;
  --sp-muted: var(--k-mute);
  --sp-line: var(--k-line);
  height: auto; overflow: visible;
}
#pane-connect.port-screen.is-on { display: grid; gap: 12px; }
#pane-connect .sp-track {
  --sp-dot: clamp(44px, 13vw, 56px);
  --sp-pad: 12px;
  --sp-r: calc(var(--sp-dot) / 2 + 2px);
  --sp-x: var(--sp-r);
  margin: 0;
  padding: var(--sp-pad) 0 12px;
  border: 1px solid var(--k-line);
  border-radius: var(--k-r);
  background: var(--k-card);
  box-shadow: var(--k-lift);
}
#pane-connect .sp-track[data-step="2"] { --sp-x: calc(50% - var(--sp-r)); }
#pane-connect .sp-track[data-step="3"] { --sp-x: calc(100% - var(--sp-r)); }
#pane-connect .sp-station {
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  color: var(--k-mute);
}
#pane-connect .sp-station strong {
  font-size: clamp(11px, 2.8vw, 13px);
  line-height: 1.15;
  text-align: center;
  white-space: nowrap;
}
#pane-connect .sp-dot {
  width: var(--sp-dot);
  height: var(--sp-dot);
  transform: none;
  border-color: var(--k-line-2);
  background: var(--k-well);
  color: var(--k-mute);
  box-shadow: none;
}
#pane-connect .sp-dot > svg { width: 52%; height: 52%; }
#pane-connect .sp-rail {
  top: calc(var(--sp-pad) + var(--sp-dot) / 2);
  left: 16.6667%;
  right: 16.6667%;
  height: 3px;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, .42);
}
#pane-connect .sp-rail i {
  width: var(--sp-x);
  background: #fff;
  box-shadow: 0 0 10px rgba(255, 255, 255, .45);
}
#pane-connect .sp-ship-wrap {
  top: 50%;
  left: var(--sp-x);
  z-index: 1;
  transform: translate(calc(-100% - 6px), -50%);
}
#pane-connect .sp-track[data-step="1"] .sp-ship-wrap {
  transform: translate(-100%, -50%);
}
#pane-connect .sp-trail { display: none; }
#pane-connect .sp-ship { width: 36px; height: 36px; }
#pane-connect .sp-station.is-on { color: #fff; }
#pane-connect .sp-station.is-on .sp-dot {
  transform: none;
  border-color: transparent;
  background: var(--k-white);
  color: var(--k-ink);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, .08);
}
#pane-connect .sp-station.is-on .sp-dot > svg { animation: none; }
#pane-connect .sp-dot::before,
#pane-connect .sp-dot::after { border-color: var(--k-line-2) !important; box-shadow: none !important; transform-origin: center; }
#pane-connect .sp-done { background: #fff; color: var(--k-ink); }
#pane-connect .sp-card {
  padding: 24px 22px 18px; border: 1px solid var(--k-line); border-radius: var(--k-r);
  background: var(--k-card); box-shadow: var(--k-lift);
}
#pane-connect .sp-step h2 { font-family: var(--wx-head); font-weight: 600; letter-spacing: -.04em; font-size: clamp(22px, 2.2vw, 27px); color: #fff; }
#pane-connect .sp-lead { max-width: 64ch; color: #fff; font-size: 14px; opacity: 1; }
#pane-connect .sp-sub-note,
#pane-connect .sp-sub-link-url { color: #fff !important; -webkit-text-fill-color: #fff !important; }
#pane-connect .sp-sub-qr svg { width: 168px; height: 168px; }
html.is-mobile #pane-connect .sp-sub-row { grid-template-columns: auto minmax(0, 1fr); align-items: center; }
html.is-mobile #pane-connect .sp-sub-qr svg { width: 112px; height: 112px; }
#pane-connect .sp-choices { gap: 10px; }
@media (min-width: 900px) { #pane-connect .sp-choices { grid-template-columns: 1fr 1fr; } }
#pane-connect .sp-choice {
  min-height: 80px; padding: 15px 16px;
  border: 1px solid var(--k-line); border-radius: 16px; background: var(--k-well);
  transition: border-color .2s, background .2s, transform .25s var(--k-spring);
}
#pane-connect .sp-choice:active { transform: scale(.985); }
#pane-connect .sp-choice-ico {
  width: 46px; height: 46px; border: 1px solid var(--k-line-2); border-radius: 13px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .015)); color: #f5f5f6; box-shadow: none;
}
#pane-connect .sp-choice-copy strong { color: #fff; }
#pane-connect .sp-choice-copy small { color: var(--k-mute); }
#pane-connect .sp-go { color: var(--k-faint); }
#pane-connect .sp-choice.is-selected,
#pane-connect .sp-choice:hover { border-color: var(--k-line-3); background: rgba(255, 255, 255, .03); }
#pane-connect .sp-sub { border-color: var(--k-line); background: var(--k-well); }
#pane-connect .sp-sub-title { color: #fff; }
#pane-connect .sp-sub-title i { background: var(--k-ok) !important; box-shadow: 0 0 0 4px rgba(74, 222, 128, .12) !important; }
#pane-connect .sp-sub-note,
#pane-connect .sp-sub-link-url { color: #fff !important; -webkit-text-fill-color: #fff !important; }
#pane-connect .sp-sub-link { border-color: var(--k-line); background: #050506; }
#pane-connect .sp-sub-copy { background: var(--k-white); color: var(--k-ink); box-shadow: none; }
#pane-connect .sp-os button,
#pane-connect .sp-seg,
#pane-connect .sp-mini-seg,
#pane-connect .sp-secondary,
#pane-connect .sp-hint { border-color: var(--k-line-2) !important; background-color: rgba(255, 255, 255, .025) !important; color: var(--k-text); }
#pane-connect .sp-os button.is-on,
#pane-connect .sp-mini-seg button.is-on { background: var(--k-white) !important; color: var(--k-ink) !important; border-color: transparent !important; }
#pane-connect .sp-os button.is-on svg,
#pane-connect .sp-os button.is-on .vf-ico { color: var(--k-ink) !important; transform: none; }
#pane-connect .sp-seg-pill { background: var(--k-white) !important; box-shadow: none !important; }
#pane-connect .sp-seg button.is-on { color: var(--k-ink) !important; }
#pane-connect .sp-hint-ico,
#pane-connect .sp-hint p { color: var(--k-dim) !important; }
#pane-connect .sp-radar {
  border-color: var(--k-line-2) !important;
  background: rgba(255, 255, 255, .03) !important;
}
#pane-connect .sp-radar-rings i { border-color: rgba(255, 255, 255, .14) !important; }
#pane-connect .sp-radar-core { background: var(--k-white) !important; color: var(--k-ink) !important; box-shadow: 0 0 30px rgba(255, 255, 255, .2) !important; }
#pane-connect .sp-empty-perks > div { border-color: var(--k-line) !important; background: var(--k-well) !important; }
#pane-connect .sp-empty-perks b { color: #fff !important; -webkit-text-fill-color: #fff !important; }
#pane-connect .sp-inf { stroke: #fff !important; }
#pane-connect .sp-steps b { background: var(--k-white) !important; color: var(--k-ink) !important; }
#pane-connect .sp-nav { border-top-color: var(--k-line); margin-top: 16px; padding-top: 14px; }
#pane-connect .sp-nav button { min-height: 50px; border-radius: 14px; border-color: var(--k-line-2); background: rgba(255, 255, 255, .03); color: var(--k-text); }
#pane-connect .sp-nav #setup-next,
#pane-connect .sp-primary { border: 0; background: var(--k-white); color: var(--k-ink); box-shadow: 0 10px 24px rgba(0, 0, 0, .4), inset 0 1px 0 #fff; }
#pane-connect .sp-primary small { color: #5d5d66 !important; }
#pane-connect .sp-primary-go { background: var(--k-ink) !important; color: #fff !important; }
#pane-connect .sp-nav #setup-next::after,
#pane-connect .sp-shine { display: none; }
.is-desktop #pane-connect .sp-card { padding: 22px 22px 16px; }
.is-desktop #pane-connect .sp-os {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
.is-desktop #pane-connect .sp-os button {
  min-height: 108px;
  padding: 16px 6px 12px;
  gap: 10px;
  border-radius: 18px;
  font-size: 12px;
  line-height: 1.15;
}
.is-desktop #pane-connect .sp-os button svg,
.is-desktop #pane-connect .sp-os [data-os="ios"] svg {
  width: 32px;
  height: 32px;
}
.is-desktop #pane-connect .sp-seg { width: min(420px, 100%); }

/* --- Тарифы --- */
#pane-plans .st-switch-row { margin: 0; }
#pane-plans .st-switch,
#pane-plans .st-wallet,
#pane-plans .shop-card,
#pane-plans .shop-plan,
#pane-plans .shop-step,
#pane-plans .pay-step,
#pane-plans .shop-perks div { border-color: var(--k-line); }
#pane-plans .st-switch,
#pane-plans .st-wallet,
#pane-plans .shop-card,
#pane-plans .shop-perks div { background: var(--k-card); box-shadow: var(--k-lift); }
#pane-plans .st-switch { border-radius: 18px; }
#pane-plans .st-switch-pill,
#pane-plans .shop-buy,
#pane-plans .shop-plan i { background: var(--k-white); color: var(--k-ink); box-shadow: 0 8px 20px rgba(0, 0, 0, .35); }
#pane-plans .st-switch button em,
#pane-plans .st-switch button small { color: inherit; }
#pane-plans .st-switch button > *:not(:first-child) { opacity: .75; }
#pane-plans .st-switch [class*="save"],
#pane-plans .st-switch button b + span,
#pane-plans .st-switch button span:last-child:not(:first-child) {
  border-color: var(--k-line-2) !important; background: rgba(255, 255, 255, .05) !important; color: var(--k-dim) !important;
}
#pane-plans .st-wallet b,
#pane-plans .st-wallet strong { color: #fff !important; -webkit-text-fill-color: #fff !important; }
#pane-plans .st-wallet-plus { background: var(--k-white); color: var(--k-ink); box-shadow: none; font-size: 28px; line-height: 1; }
#pane-plans .st-switch button { color: var(--k-mute); }
#pane-plans .st-switch button.is-on { color: var(--k-ink); }
#pane-plans .shop-buy {
  width: 100%; margin-inline: 0;
  justify-content: space-between; gap: 14px; padding-inline: 18px;
}
#pane-plans .shop-hint {
  display: grid; gap: 3px; width: 100%; margin: 12px 0 2px; padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, .28); border-radius: 16px;
  background: #fff; color: #111; text-align: left;
  box-shadow: inset 0 1px 0 #fff;
}
#pane-plans .shop-hint[hidden] { display: none; }
#pane-plans .shop-hint b { font-size: 14px; font-weight: 800; letter-spacing: -.02em; }
#pane-plans .shop-hint span { color: #3f3f46; font-size: 13px; font-weight: 650; line-height: 1.35; }
#pane-plans .st-switch button small:has(.st-switch-tag) { opacity: 1; }
#pane-plans .st-switch-tag {
  display: inline-flex; align-items: center; gap: 5px;
  margin-top: 2px; padding: 3px 7px 3px 8px; border-radius: 999px;
  background: rgba(74, 222, 128, .1) !important;
  box-shadow: inset 0 0 0 1px rgba(74, 222, 128, .38) !important;
  color: #b6f5cc !important;
  font-style: normal; font-size: 11px; font-weight: 700; line-height: 1; letter-spacing: .01em;
  opacity: 1 !important;
}
#pane-plans .st-switch-tag i { font-style: normal; font-weight: 700; opacity: .8; }
#pane-plans .st-switch-tag b {
  font-family: var(--wx-head); font-weight: 700; letter-spacing: -.04em; font-size: 12px;
  color: #fff !important; -webkit-text-fill-color: #fff !important;
}
#pane-plans .st-switch button.is-on .st-switch-tag {
  background: #10261a !important;
  box-shadow: 0 6px 14px rgba(16, 38, 26, .22), inset 0 0 0 1px rgba(255, 255, 255, .08) !important;
  color: #d7ffe6 !important;
}
#pane-plans .st-switch button.is-on .st-switch-tag i { opacity: .72; }
#pane-plans .st-switch button.is-on .st-switch-tag b { color: #7dffb0 !important; -webkit-text-fill-color: #7dffb0 !important; }
#pane-plans .shop-card { padding: 22px; border-radius: var(--k-r); }
#pane-plans .shop-card h3,
#pane-plans .shop-card h2 { font-family: var(--wx-head); font-weight: 600; letter-spacing: -.04em; color: #fff; }
#pane-plans .shop-plan { border-radius: 16px; background: var(--k-well); }
#pane-plans .shop-plan.is-on { border-color: rgba(255, 255, 255, .5); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25), 0 0 30px rgba(255, 255, 255, .05); }
#pane-plans .shop-plan em,
#pane-plans .shop-num span { color: var(--k-dim) !important; -webkit-text-fill-color: var(--k-dim) !important; }
#pane-plans .shop-num b,
#pane-plans .shop-num strong { font-family: var(--wx-head); font-weight: 600; letter-spacing: -.05em; }
#pane-plans .shop-plan small,
#pane-plans .shop-head em,
#pane-plans .st-rate,
#pane-plans .shop-note,
#pane-plans .shop-meta { color: var(--k-mute); }
#pane-plans .shop-meta b { color: #fff; }
#pane-plans .shop-step,
.pay-sheet .pay-step {
  display: grid; place-items: center; padding: 0; line-height: 1;
  font-family: var(--wx-head); font-weight: 500; font-size: 30px;
}
#pane-plans .shop-num,
.pay-sheet .pay-num { align-items: center; }
#pane-plans .shop-num span,
.pay-sheet .pay-num span { display: inline-flex; align-items: center; line-height: 1; }
.pay-sheet .pay-num input {
  flex: none;
  width: 3ch;
  max-width: none;
  height: 1em;
  padding: 0;
  line-height: 1;
  text-align: center;
  field-sizing: content;
}
.is-desktop .pay-sheet .pay-card { width: min(560px, calc(100vw - 48px)); }
.st-wallet-plus, .sc-plus { line-height: 1; }
#pane-plans .shop-step { background: rgba(255, 255, 255, .035); border: 1px solid var(--k-line-2); color: #fff; }
#pane-plans .shop-range { accent-color: #fff; }
#pane-plans .shop-perks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.is-desktop #pane-plans .shop-perks { grid-template-columns: repeat(4, minmax(0, 1fr)); }
#pane-plans .shop-perks div { min-width: 0; padding: 15px; border-radius: 16px; }
#pane-plans .shop-perks b { font-size: 14px; color: #fff; }
#pane-plans .shop-perks span { display: block; margin-top: 3px; font-size: 12px; line-height: 1.35; color: var(--k-mute); }

/* --- Помощь --- */
#pane-help .hp-card,
#pane-help .hp-hero,
#pane-help .hp-cta,
#pane-help .hp-search,
#pane-help .hp-empty {
  border-color: var(--k-line) !important;
  background: var(--k-card) !important;
  box-shadow: var(--k-lift) !important;
}
#pane-help .hp-hero-sky,
#pane-help .hp-hero::before,
#pane-help .hp-hero::after,
#pane-help .hp-card::before,
#pane-help .hp-card::after { display: none !important; }
#pane-help .hp-kicker { border-color: var(--k-line-2) !important; background: rgba(255, 255, 255, .04) !important; color: var(--k-dim) !important; }
#pane-help .hp-kicker i { background: var(--k-ok) !important; box-shadow: none !important; }
#pane-help .hp-hero-copy b,
#pane-help .hp-card-h b { color: #fff !important; font-family: var(--wx-head); font-weight: 600; letter-spacing: -.035em; -webkit-text-fill-color: #fff !important; }
#pane-help .hp-hero-copy small,
#pane-help .hp-card-h small { color: var(--k-mute) !important; }
#pane-help .hp-avatar,
#pane-help .hp-card-ico,
#pane-help .hp-ico,
#pane-help .hp-chip-ico,
#pane-help .hp-cta-ico,
#pane-help .hp-empty-ico,
#pane-help .hp-dev-tabs button > span,
#pane-help .st-legal-ico {
  border: 1px solid var(--k-line-2) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .015)) !important;
  color: #e4e4e7 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}
#pane-help .hp-avatar svg,
#pane-help .hp-card-ico svg,
#pane-help .hp-ico svg { color: #e4e4e7 !important; stroke: currentColor; }
#pane-help .hp-contact {
  border: 0 !important; background: var(--k-white) !important; color: var(--k-ink) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .45), inset 0 1px 0 #fff !important;
}
#pane-help .hp-contact-ico { background: var(--k-ink) !important; color: #fff !important; box-shadow: none !important; }
#pane-help .hp-contact-txt b { color: var(--k-ink) !important; }
#pane-help .hp-contact-txt small { color: #5d5d66 !important; }
#pane-help .hp-contact-go { color: var(--k-ink) !important; }
#pane-help .hp-chip {
  min-height: 64px; padding: 12px 16px; gap: 12px; border-radius: 16px;
  border-color: var(--k-line) !important; background: var(--k-well) !important;
}
#pane-help .hp-chip-ico { width: 40px; height: 40px; border-radius: 12px; }
#pane-help .hp-chip small { color: var(--k-mute) !important; font-size: 12px; }
#pane-help .hp-chip b { color: #fff !important; font-size: 16px; letter-spacing: -.02em; }
#pane-help .hp-hero-row { display: grid; grid-template-columns: 1fr; gap: 10px; }
#pane-help .hp-hero-row > .hp-chip { min-width: 0; width: 100%; }
#pane-help .hp-search input::placeholder { color: var(--k-mute) !important; opacity: 1; }
#pane-help .hp-search input { color: #fff !important; caret-color: #fff; }
#pane-help .hp-chip-copy { width: 20px; height: 20px; color: #fff !important; opacity: 1; }
#pane-help .hp-tip { color: var(--k-mute) !important; }
#pane-help .hp-tip svg { color: var(--k-dim) !important; }
#pane-help .hp-search svg { color: var(--k-mute) !important; }
#pane-help .hp-search input { color: #fff; }
#pane-help .hp-dev-tabs { border-color: var(--k-line) !important; background: var(--k-well) !important; }
#pane-help .hp-dev-tabs button { color: var(--k-mute) !important; background: transparent !important; box-shadow: none !important; }
#pane-help .hp-dev-tabs button.is-on,
#pane-help .hp-dev-tabs button[aria-selected="true"] { background: var(--k-white) !important; color: var(--k-ink) !important; }
#pane-help .hp-dev-tabs button.is-on > span,
#pane-help .hp-dev-tabs button[aria-selected="true"] > span { border-color: transparent !important; background: transparent !important; color: var(--k-ink) !important; box-shadow: none !important; }
#pane-help .hp-steps li::before {
  background: rgba(255, 255, 255, .06) !important; color: #fff !important;
  border: 1px solid var(--k-line-2) !important; box-shadow: none !important;
}
#pane-help .hp-steps li::after { background: var(--k-line) !important; }
#pane-help .hp-steps b,
#pane-help .hp-text b { color: #fff !important; }
#pane-help .hp-item { border-color: var(--k-line) !important; background: transparent !important; }
#pane-help .hp-item[open] { background: rgba(255, 255, 255, .02) !important; }
#pane-help .hp-item summary b { color: var(--k-text) !important; }
#pane-help .hp-item summary::after { border-color: var(--k-mute) !important; }
#pane-help .hp-item[open] summary::after { border-color: #fff !important; }
#pane-help .hp-item[open] { border-color: var(--k-line-3) !important; }
#pane-help .hp-item[open] .hp-ico { background: #fff !important; color: var(--k-ink) !important; }
#pane-help .hp-item[open] .hp-ico svg { stroke: var(--k-ink) !important; }
#pane-help .hp-cta { align-items: center; }
#pane-help .hp-cta-ico { animation: none; }
#pane-help .hp-cta-ico svg { display: block; }
#pane-help .hp-cta-txt { display: flex; flex-direction: column; justify-content: center; gap: 2px; line-height: 1.15; }
#pane-help .hp-cta-btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: 42px; line-height: 1;
}
#pane-help .hp-go,
#pane-help .hp-cta-btn,
#pane-help .hp-empty-btn {
  border: 0 !important; background: var(--k-white) !important; color: var(--k-ink) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .4), inset 0 1px 0 #fff !important;
}
#pane-help .hp-go svg { color: var(--k-ink) !important; }
#pane-help .st-legal-btn { border-color: var(--k-line) !important; background: var(--k-well) !important; }
#pane-help mark { background: rgba(255, 255, 255, .9); color: #000; border-radius: 3px; }

/* --- Партнёрка --- */
#pane-partner .pt-hero,
#pane-partner .pt-invite,
#pane-partner .pt-how,
#pane-partner .pt-chart,
#pane-partner .pt-stats,
#pane-partner .pt-card,
#pane-partner .pt-tabs,
#pane-partner .pt-list,
#pane-partner .pt-friends,
#pane-partner .pt-history {
  border-color: var(--k-line) !important;
  box-shadow: var(--k-lift) !important;
  background: var(--k-card) !important;
}
#pane-partner .pt-hero::before,
#pane-partner .pt-hero::after,
#pane-partner .pt-orbit,
#pane-partner [class*="pt-sky"],
#pane-partner [class*="pt-glow"] { display: none !important; }
#pane-partner h2,
#pane-partner h3,
#pane-partner .pt-big,
#pane-partner .pt-sum {
  color: #fff !important; -webkit-text-fill-color: #fff !important; background: none !important;
  text-shadow: none !important; filter: none !important;
}
#pane-partner .pt-rate,
#pane-partner [class*="pt-badge"] {
  border: 1px solid var(--k-line-2) !important; background: rgba(255, 255, 255, .05) !important;
  color: #fff !important; box-shadow: none !important;
}
#pane-partner button,
#pane-partner a { --pt-gold: #fff; }
#pane-partner [class*="pt-btn"],
#pane-partner [class*="pt-cta"],
#pane-partner [class*="pt-share"],
#pane-partner [data-partner-share],
#pane-partner [data-partner-convert]:not([disabled]) {
  border: 0 !important; background: var(--k-white) !important; color: var(--k-ink) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .4), inset 0 1px 0 #fff !important;
}
#pane-partner [data-partner-share] *,
#pane-partner [data-partner-convert]:not([disabled]) * { color: var(--k-ink) !important; }
#pane-partner [data-partner-cash] {
  border: 1px solid var(--k-line-2) !important; background: rgba(255, 255, 255, .03) !important; color: var(--k-text) !important;
  box-shadow: none !important;
}
#pane-partner [data-partner-cash] * { color: inherit !important; }
#pane-partner [data-partner-copy] { border-color: var(--k-line-2) !important; background: var(--k-well) !important; color: #fff !important; }
#pane-partner svg:not(.st-rk) { filter: grayscale(1); }
#pane-partner img { filter: grayscale(1); }
#pane-partner [class*="track"],
#pane-partner [class*="rail"] { background: rgba(255, 255, 255, .08) !important; box-shadow: none !important; }
#pane-partner [class*="fill"],
#pane-partner [class*="bar"] i { background: linear-gradient(90deg, #3f3f46, #fff) !important; box-shadow: 0 0 12px rgba(255, 255, 255, .25) !important; }
#pane-partner [class*="node"],
#pane-partner [class*="chip"] { border-color: var(--k-line-2) !important; background: var(--k-well) !important; color: #fff !important; box-shadow: none !important; }
#pane-partner [class*="line"] { stroke: rgba(255, 255, 255, .2) !important; }
#pane-partner small,
#pane-partner p { color: var(--k-dim); }
#pane-partner .pt-hero-sum {
  font-family: var(--wx-head); font-weight: 700; letter-spacing: -.04em;
  background: linear-gradient(180deg, #fff 30%, #9a9ca6) !important;
  -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important;
}
#pane-partner .pt-hero-sub { color: var(--k-dim); margin-bottom: 0; }
#pane-partner .pt-goal-track { height: 6px; margin-top: 36px; }
#pane-partner .st-rk { filter: drop-shadow(0 0 6px rgba(255, 171, 69, .25)); }
#pane-partner .pt-row-ico .st-rk,
#pane-partner .pt-act-ico .st-rk,
#pane-partner .pt-goal-pin {
  width: 44px;
  height: 44px;
  margin: -22px 0 0 -22px;
}
#pane-partner .pt-goal-pin em {
  width: 44px;
  height: 44px;
}
#pane-partner .pt-goal-pin em .st-rk {
  width: 32px !important;
  height: 32px !important;
  margin: 0;
  opacity: 1 !important;
  filter: drop-shadow(0 0 5px rgba(255, 171, 69, .9)) !important;
  transform: rotate(45deg) scale(1.15);
  transform-origin: center;
}
html.is-app #pane-partner .pt-goal-pin em .st-rk {
  width: 18px !important;
  height: 18px !important;
  transform: rotate(45deg);
}
#pane-partner .pt-row-ico .st-rk { width: 20px; height: 20px; }
#pane-partner .pt-act-ico .st-rk { width: 22px; height: 22px; }
#pane-partner .pt-ico-swap .pt-ico-coin,
#pane-partner .pt-ico-swap .pt-ico-arrow { display: none; }
#pane-partner .pt-ico-swap .st-rk {
  position: static; width: 22px; height: 22px; margin: 0; transform: none; filter: none;
}
#pane-partner p .st-rk,
#pane-partner small .st-rk,
#pane-partner li .st-rk {
  display: inline-block; width: 2.02cap; height: 2.02cap; margin: 0 .04em 0 .08em; vertical-align: -.54cap;
  position: static; transform: none;
}
#pane-partner .pt-flame::before,
#pane-partner .pt-flame::after { background: radial-gradient(closest-side, rgba(255, 255, 255, .55), transparent) !important; filter: none !important; }
#pane-partner .pt-flame i { background: #fff !important; box-shadow: 0 0 6px rgba(255, 255, 255, .7) !important; }
#pane-partner .pt-goal-pin em {
  border: 1px solid var(--k-line-3) !important; background: #121215 !important; box-shadow: 0 0 0 4px #0d0d10 !important;
}
#pane-partner .pt-goal-pin.is-on em {
  border-color: #fff !important; background: #fff !important;
  box-shadow: 0 0 0 4px #0d0d10, 0 0 18px rgba(255, 255, 255, .35) !important;
}
#pane-partner .pt-goal-pin.is-on em .st-rk { filter: none; }
#pane-partner .pt-goal-pin.is-on em svg:not(.st-rk) { stroke: var(--k-ink) !important; }
#pane-partner .pt-goal-pin b { color: var(--k-mute) !important; font-weight: 700; }
#pane-partner .pt-goal-pin.is-on b { color: #fff !important; }
#pane-partner .pt-act-ico,
#pane-partner .pt-act-rk:not(.is-locked) .pt-act-ico {
  background: var(--k-ink) !important; color: #fff !important; box-shadow: none !important; filter: none !important; opacity: 1 !important;
}
#pane-partner .pt-act-rk:not(.is-locked) .pt-act-ico * { color: #fff !important; }
#pane-partner .pt-act-cash .pt-act-ico { background: rgba(255, 255, 255, .06) !important; }
#pane-partner .pt-ico-coin {
  background: linear-gradient(160deg, #ffe3a0, #ffab45 55%, #ff6e3a) !important; color: #3a1a00 !important;
  box-shadow: 0 0 0 2px var(--k-ink), 0 0 10px rgba(255, 171, 69, .45) !important;
}
#pane-partner .pt-ico-coin svg { stroke: var(--k-ink) !important; }
#pane-partner .pt-link em {
  flex: none; color: var(--k-mute); font-size: 11px; font-weight: 800; font-style: normal;
  letter-spacing: .06em; text-transform: uppercase;
}
#pane-partner .pt-link span { color: #fff !important; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-weight: 600; font-size: 13px; }
#pane-partner .pt-link + .pt-link { margin-top: 0; }
#pane-partner .pt-link svg { stroke: var(--k-dim) !important; }
#pane-partner .pt-tree { height: 168px; }
#pane-partner .pt-tree-lines { filter: none !important; overflow: visible; }
#pane-partner .pt-tree-path {
  stroke: rgba(255, 196, 120, .72) !important;
  filter: drop-shadow(0 0 4px rgba(255, 176, 70, .45));
}
#pane-partner .pt-tree-path-2 {
  stroke: rgba(186, 164, 255, .7) !important;
  filter: drop-shadow(0 0 4px rgba(150, 130, 255, .4));
}
#pane-partner .pt-tree-coin {
  fill: #ffc56a !important;
  filter: drop-shadow(0 0 5px rgba(255, 186, 70, .95)) !important;
}
#pane-partner .pt-tree-coin-2 {
  fill: #c9b4ff !important;
  filter: drop-shadow(0 0 5px rgba(160, 140, 255, .9)) !important;
}
#pane-partner .pt-node em,
#pane-partner .pt-steps li:nth-child(2) em { color: #ffc56a !important; }
#pane-partner .pt-node-2 em,
#pane-partner .pt-steps li:nth-child(3) em { color: #c9b4ff !important; }
#pane-partner .pt-stat-row:nth-child(1) .pt-stat-pay b {
  color: #ffc56a !important; -webkit-text-fill-color: #ffc56a !important;
  animation: ptSumGlow 3.2s ease-in-out infinite;
}
#pane-partner .pt-stat-row:nth-child(2) .pt-stat-pay b {
  color: #c9b4ff !important; -webkit-text-fill-color: #c9b4ff !important;
  animation: ptSumGlow 3.2s ease-in-out infinite;
  animation-delay: .6s;
}
#pane-partner .pt-stat-row:nth-child(1) .pt-stat-pay span { color: #e7c48a !important; }
#pane-partner .pt-stat-row:nth-child(2) .pt-stat-pay span { color: #c4b6f2 !important; }
#pane-partner .pt-bar.is-on {
  background: linear-gradient(180deg, #ffe3ad, #ffab45 58%, #b9a4ff) !important;
  box-shadow: 0 0 12px rgba(255, 176, 80, .28) !important;
}
#pane-partner .pt-bar::before,
#pane-partner .pt-bar::after { filter: none !important; }
@keyframes ptSumGlow {
  0%, 100% { text-shadow: 0 0 0 transparent; }
  50% { text-shadow: 0 0 12px currentColor; }
}
#pane-partner .pt-side { display: contents; }
@media (min-width: 1100px) {
  .is-desktop #pane-partner .earn-screen { align-items: stretch; }
  .is-desktop #pane-partner .earn-screen > .pt-how { grid-row: 2; }
  .is-desktop #pane-partner .earn-screen > .pt-side {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
  }
  .is-desktop #pane-partner .earn-screen > .pt-tabs,
  .is-desktop #pane-partner .earn-screen > .pt-list { grid-column: 1 / -1; }
  .is-desktop #pane-partner .pt-side .pt-stats,
  .is-desktop #pane-partner .pt-side .pt-chart { margin: 0; }
  .is-desktop #pane-partner .pt-side .pt-chart {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .is-desktop #pane-partner .pt-side .pt-bars {
    flex: 1;
    height: auto;
    min-height: 148px;
    border-radius: 16px;
    background:
      radial-gradient(140px 90px at 16% 100%, rgba(255, 186, 80, .16), transparent 72%),
      radial-gradient(140px 90px at 84% 100%, rgba(176, 150, 255, .16), transparent 72%);
  }
  .is-desktop #pane-partner .pt-side .pt-empty {
    flex: 1;
    display: grid;
    place-items: center;
    min-height: 132px;
    margin: 10px 0 0;
    text-align: center;
    background:
      radial-gradient(160px 90px at 18% 100%, rgba(255, 186, 80, .14), transparent 72%),
      radial-gradient(160px 90px at 82% 100%, rgba(176, 150, 255, .14), transparent 72%);
  }
}
@media (prefers-reduced-motion: reduce) {
  #pane-partner .pt-stat-pay b { animation: none; }
}
#pane-partner .pt-steps span { color: var(--k-dim) !important; }
#pane-partner .pt-steps li::before {
  background: #fff !important; color: var(--k-ink) !important; border: 0 !important; box-shadow: none !important;
}
#pane-partner .pt-stat-pay b { color: #fff !important; -webkit-text-fill-color: #fff !important; background: none !important; }
#pane-partner .pt-stat-who span,
#pane-partner .pt-stat-pay span,
#pane-partner .pt-stat-foot,
#pane-partner .pt-stat-foot span { color: var(--k-mute) !important; }
#pane-partner .pt-stat-foot b { color: #fff !important; }
#pane-partner .pt-stat-foot i { background: var(--k-mute) !important; box-shadow: none !important; }
#pane-partner .pt-chart-pick {
  border: 1px solid var(--k-line-2) !important; background: rgba(255, 255, 255, .04) !important; color: #fff !important; box-shadow: none !important;
}
#pane-partner .pt-chart-pick svg { stroke: var(--k-dim) !important; }
#pane-partner .pt-chart-head b { color: #fff !important; -webkit-text-fill-color: #fff !important; background: none !important; }
#pane-partner .pt-chart-menu { background: #0e0e11 !important; border-color: var(--k-line-2) !important; box-shadow: 0 18px 40px rgba(0, 0, 0, .6) !important; }
#pane-partner .pt-chart-menu button { color: var(--k-dim) !important; background: transparent !important; }
#pane-partner .pt-chart-menu button.is-on { color: var(--k-ink) !important; background: #fff !important; }
#pane-partner .pt-bar { background: rgba(255, 255, 255, .08) !important; box-shadow: none !important; }
#pane-partner .pt-bar.is-on { background: linear-gradient(180deg, #fff, #6b6d76) !important; }
#pane-partner .pt-bar::before,
#pane-partner .pt-bar::after { filter: grayscale(1) !important; }
#pane-partner .pt-bar small { color: var(--k-mute) !important; }
#pane-partner .pt-empty {
  border: 1px dashed var(--k-line-2) !important; background: rgba(255, 255, 255, .015) !important; color: var(--k-mute) !important;
}
#pane-partner .pt-tabs { padding: 4px; }
#pane-partner .pt-tabs-pill { background: #fff !important; box-shadow: 0 6px 16px rgba(0, 0, 0, .4) !important; }
#pane-partner .pt-tabs button { color: var(--k-dim) !important; background: transparent !important; }
#pane-partner .pt-tabs button.is-on { color: var(--k-ink) !important; }
#pane-partner .pt-tabs em { background: rgba(255, 255, 255, .1) !important; color: inherit !important; }
#pane-partner .pt-tabs button.is-on em { background: var(--k-ink) !important; color: #fff !important; }
#pane-partner .pt-ava { background: rgba(255, 255, 255, .08) !important; color: #fff !important; box-shadow: none !important; }
#pane-partner .pt-tag { background: rgba(255, 255, 255, .06) !important; color: var(--k-dim) !important; border: 1px solid var(--k-line) !important; }
#pane-partner .pt-friend-sum b,
#pane-partner [class*="pt-hist"] b { color: #fff !important; }

/* --- Окно пополнения --- */
.pay-sheet .pay-card { background: #0e0e11 !important; border-color: var(--k-line-2) !important; }
.pay-sheet .pay-card h2,
.pay-sheet .pay-num input,
.pay-sheet .pay-num span { color: #fff !important; -webkit-text-fill-color: #fff !important; background: none !important; text-shadow: none !important; }
html.is-mobile .pay-sheet .pay-card h2 {
  font-size: 22px;
  line-height: 1.1;
  letter-spacing: -.04em;
  white-space: nowrap;
  padding-right: 48px;
}
html.is-mobile .pay-sheet .pay-lead,
html.is-mobile .pay-sheet .pay-h,
html.is-mobile .pay-sheet .pay-note,
html.is-mobile .pay-sheet .pay-method b,
html.is-mobile .pay-sheet .pay-method small {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
html.is-mobile .pay-sheet .pay-method b { white-space: nowrap; }
.pay-sheet .pay-step,
.pay-sheet .pay-chips button,
.pay-sheet .pay-methods button { border-color: var(--k-line-2) !important; background: rgba(255, 255, 255, .03) !important; color: var(--k-text) !important; box-shadow: none !important; }
.pay-sheet .pay-chips button.is-on,
.pay-sheet .pay-methods button.is-on { border-color: rgba(255, 255, 255, .6) !important; background: rgba(255, 255, 255, .08) !important; }
.pay-sheet .pay-go { border: 0 !important; background: var(--k-white) !important; color: var(--k-ink) !important; box-shadow: 0 10px 24px rgba(0, 0, 0, .4), inset 0 1px 0 #fff !important; }
.pay-sheet .pay-go * { color: var(--k-ink) !important; }
.pay-sheet .pay-go s { color: #6e6e77 !important; margin-right: 6px; font-weight: 650; text-decoration: line-through; }
.pay-sheet .pay-hero { margin-bottom: 28px; }
.pay-tools { display: grid; gap: 22px; margin: 20px 0 26px; }
.pay-tool { display: grid; gap: 8px; }
.pay-tool[hidden] { display: none !important; }
.pay-tool-label { color: #a3a3ab; font: 750 11px/1.2 Unbounded, sans-serif; letter-spacing: .06em; text-transform: uppercase; }
.pay-tool-hint { margin: 0; color: #a3a3ab; font: 600 13px/1.4 Manrope, sans-serif; }
.pay-tool-row {
  display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 4px 4px 4px 12px;
  border-radius: 16px; border: 1px solid var(--k-line-2); background: rgba(255, 255, 255, .03);
}
.pay-tool-row input {
  flex: 1; min-width: 0; height: 40px; padding: 0; border: 0; background: transparent;
  color: #fff; font: 650 15px Manrope, sans-serif;
}
.pay-sheet .pay-tool-row:focus-within {
  border-color: rgba(255, 193, 74, .95);
  box-shadow: 0 0 0 1px rgba(255, 193, 74, .95);
}
.pay-sheet .pay-tool-row input:focus,
.pay-sheet .pay-tool-row input:focus-visible {
  outline: none;
  border-radius: 0;
}
.pay-tool-row input::placeholder { color: #6e6e77; }
.pay-tool-row button {
  flex: none; height: 40px; padding: 0 14px; border: 0; border-radius: 12px;
  background: var(--k-white); color: var(--k-ink) !important; font: 800 13px Manrope, sans-serif; cursor: pointer;
}
.pay-tool-row button.is-ghost { background: transparent; color: #fff !important; border: 1px solid var(--k-line-2); }
.pay-tool-copy { display: grid; gap: 2px; min-width: 0; flex: 1; padding: 6px 4px; }
.pay-tool-copy b { color: #fff; font: 750 14px Manrope, sans-serif; }
.pay-sheet .pay-range { accent-color: #fff; }
.pay-sheet .pay-card { scrollbar-color: rgba(255, 255, 255, .72) transparent; scrollbar-width: thin; }
.pay-sheet .pay-card::-webkit-scrollbar { width: 8px; background: transparent; }
.pay-sheet .pay-card::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
  background-image: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, .7) 18%, rgba(255, 255, 255, .22) 60%, rgba(255, 255, 255, .55) 100%);
}
.pay-sheet .pay-lead,
.pay-sheet small { color: var(--k-mute) !important; }
.pay-sheet .pay-method b { color: #fff !important; }
.pay-sheet .pay-x {
  display: grid; place-items: center; border: 1px solid var(--k-line-2) !important;
  background: rgba(255, 255, 255, .04) !important; color: #fff !important;
}
.pay-sheet .pay-x svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.pay-sheet .pay-ic {
  overflow: hidden; border: 1px solid rgba(255, 255, 255, .14) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}
.pay-sheet .pay-ic svg { width: 34px; height: 34px; overflow: visible; filter: none; }
.pay-sheet.is-pack .pay-hero { display: none; }
.pay-sheet .pay-method.is-wallet .pay-ic {
  display: grid; place-items: center;
  background: #141418 !important;
}
.pay-sheet .pay-method.is-wallet .st-rk { width: 22px; height: 22px; }
.pay-sheet .pay-method.is-low { opacity: .62; }
.pay-sheet .pay-method.is-nope { animation: kNope .45s var(--k-ease); }
@keyframes kNope { 0%, 100% { translate: 0; } 25% { translate: -4px; } 75% { translate: 4px; } }
.pay-sheet .pay-method.is-sbp .pay-ic { background: linear-gradient(160deg, #fff, #e6e2f6) !important; }
.pay-sheet .pay-method.is-sbp .pay-ic svg { width: 30px; height: 30px; }
.pay-sheet .pay-method.is-card .pay-ic { background: linear-gradient(160deg, #2a3c8e, #121a44) !important; }
.pay-sheet .pay-method.is-world .pay-ic { background: linear-gradient(160deg, #1d4f8f, #0b1a3f) !important; }
.pay-sheet .pay-method.is-stars .pay-ic {
  border-color: rgba(255, 214, 140, .35) !important;
  background: radial-gradient(circle at 50% 45%, rgba(255, 200, 80, .32), transparent 65%), linear-gradient(160deg, #3d2a6e, #1a1236) !important;
}
.pay-sheet .pay-method.is-crypto .pay-ic { background: linear-gradient(160deg, #145540, #0a2219) !important; }
.pay-sheet .tp-ic-sbp path { animation: tpSbp 3.4s ease-in-out infinite; animation-delay: calc(var(--i) * .11s); }
.pay-sheet .tp-card-body { transform-box: view-box; transform-origin: 16px 16px; animation: tpCardTilt 4.6s ease-in-out infinite; }
.pay-sheet .tp-card-shine { animation: tpCardShine 3.2s ease-in-out infinite; }
.pay-sheet .tp-star-body { transform-box: view-box; transform-origin: 16px 15.5px; animation: tpStarBeat 2.8s ease-in-out infinite; }
.pay-sheet .tp-spark { transform-box: fill-box; transform-origin: center; animation: tpTwinkle 2.2s ease-in-out infinite; }
.pay-sheet .tp-spark-2 { animation-duration: 2.9s; animation-delay: -1.1s; }
.pay-sheet .tp-coin { transform-box: view-box; transform-origin: 14.6px 17.6px; animation: tpCoinFlip 4.2s ease-in-out infinite; }
.pay-sheet .tp-coin-back { transform-box: view-box; transform-origin: 23.4px 9px; animation: tpBob 3s ease-in-out infinite; }
.pay-sheet .tp-world-land { animation: tpWorldSpin 14s linear infinite; }
.pay-sheet .tp-world-coin { transform-origin: 24px 23.4px; animation: tpWorldCoin 4s ease-in-out infinite; }
@keyframes tpSbp { 0%, 55%, 100% { opacity: 1; } 25% { opacity: .5; } }
@keyframes tpCardTilt { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(4deg) translateY(-.6px); } }
@keyframes tpCardShine { 0%, 50% { transform: translateX(-10px); } 85%, 100% { transform: translateX(36px); } }
@keyframes tpStarBeat { 0%, 100% { transform: scale(1) rotate(0); } 50% { transform: scale(1.08) rotate(8deg); } }
@keyframes tpTwinkle { 0%, 100% { opacity: .2; transform: scale(.5); } 50% { opacity: 1; transform: scale(1.15); } }
@keyframes tpCoinFlip { 0%, 68%, 100% { transform: scaleX(1); } 79% { transform: scaleX(.08); } 90% { transform: scaleX(1); } }
@keyframes tpBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-1.4px); } }
@keyframes tpWorldSpin { to { transform: translateX(-20px); } }
@keyframes tpWorldCoin { 0%, 70%, 100% { transform: none; } 80% { transform: scaleX(.15); } 90% { transform: scaleX(1); } }
.pay-sheet .pay-check {
  display: grid; place-items: center; width: 22px; height: 22px; padding: 0 !important;
  border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .32) !important;
  background: transparent !important; color: transparent !important; font-size: 0 !important;
  box-shadow: none !important; opacity: 1 !important;
}
.pay-sheet .pay-check::after {
  content: ""; width: 8px; height: 8px; border-radius: 50%; background: #fff;
  transform: scale(0); transition: transform .28s var(--k-spring);
}
.pay-sheet .pay-method.is-on .pay-check {
  border-color: #fff !important;
  box-shadow: 0 0 10px rgba(255, 255, 255, .22) !important;
}
.pay-sheet .pay-method.is-on .pay-check::after { transform: scale(1); }
.pay-sheet .pay-method.is-on { border-color: rgba(255, 255, 255, .55) !important; background: rgba(255, 255, 255, .06) !important; }
.pay-sheet [class*="soon"],
.pay-sheet .pay-method em { background: rgba(255, 255, 255, .06) !important; color: var(--k-dim) !important; border: 1px solid var(--k-line) !important; }

/* ============ Телефон ============ */
.is-mobile .app { padding-bottom: calc(112px + var(--safe-b)); }
.is-mobile .pane-head { margin-bottom: 14px; }
.is-mobile .pane-head h2 { font-size: 26px; }
.is-mobile .pane-head p { margin-top: 5px; font-size: 13.5px; }
.is-mobile .card { padding: 16px; }
.is-mobile .card-acts { flex-direction: column; }
body.wx-app .toast {
  border: 0;
  border-radius: 999px;
  background: var(--k-white);
  color: var(--k-ink);
  font-weight: 800;
  letter-spacing: -.02em;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .42), inset 0 1px 0 #fff;
}
body.wx-app .toast.is-bad {
  color: #9f1239;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .42), inset 0 0 0 1.5px rgba(190, 24, 60, .28), inset 0 1px 0 #fff;
}
body.wx-app .toast.is-device {
  background: var(--k-white);
  color: var(--k-ink);
  border: 0;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .42), inset 0 1px 0 #fff;
}
body.wx-app .toast-kicker { color: #5c5c66; }
body.wx-app .toast.is-device strong,
body.wx-app .toast-line { color: var(--k-ink); }
.is-mobile .toast { bottom: calc(100px + var(--safe-b)); }

/* --- Нижнее меню: одна подсветка ездит между пунктами --- */
.is-mobile .tabbar {
  --tab: 0;
  left: 50%; right: auto; bottom: calc(12px + var(--safe-b));
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: stretch; gap: 0;
  width: min(400px, calc(100% - 24px)); height: 66px; padding: 5px;
  border-radius: 24px; transform: translateX(-50%);
  background: rgba(14, 14, 17, .78);
  border: 1px solid var(--k-line-2);
  backdrop-filter: blur(24px) saturate(140%); -webkit-backdrop-filter: blur(24px) saturate(140%);
  box-shadow: 0 24px 50px rgba(0, 0, 0, .7), inset 0 1px 0 rgba(255, 255, 255, .06);
  transition: opacity .25s, translate .35s var(--k-ease);
}
.is-mobile .tabbar[hidden] { display: none; }
body:has(.cab-sheet.is-on) .tabbar,
body:has(.tg-hello.is-on) .tabbar,
body:has(.pay-sheet:not([hidden])) .tabbar { opacity: 0; translate: 0 24px; pointer-events: none; }
.tabbar-glide { display: none; }
.is-mobile .tabbar-glide {
  position: absolute; top: 5px; bottom: 5px; left: 5px; z-index: 0; display: block;
  width: calc((100% - 10px) / 5); border-radius: 19px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .05));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), inset 0 0 0 1px rgba(255, 255, 255, .06);
  transform: translateX(calc(var(--tab) * 100%));
  transition: transform .55s var(--k-spring);
}
.is-mobile .tabbar-glide::after {
  content: ""; position: absolute; top: -1px; left: 30%; right: 30%; height: 2px; border-radius: 2px;
  background: #fff; box-shadow: 0 0 10px rgba(255, 255, 255, .8);
}
.is-mobile .tabbar button {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  min-width: 0; height: auto; padding: 0 2px; border-radius: 19px; background: transparent; box-shadow: none;
  color: var(--k-mute); font-size: 10.5px; font-weight: 800; letter-spacing: -.005em;
  transition: color .3s;
  -webkit-tap-highlight-color: transparent;
}
.is-mobile .tabbar button > svg { flex: none; width: 22px; height: 22px; margin: 0; color: inherit; transition: transform .45s var(--k-spring); }
.is-mobile .tabbar button > span {
  max-width: 100%; overflow: hidden; opacity: 1; margin: 0; white-space: nowrap; text-overflow: ellipsis;
  transition: none;
}
.is-mobile .tabbar button.is-on,
.is-mobile .tabbar button.is-on > svg { color: #fff; background: transparent; box-shadow: none; }
.is-mobile .tabbar button.is-on > svg { transform: translateY(-1px); }
.is-mobile .tabbar button.is-on > span { max-width: 100%; margin: 0; opacity: 1; }
.is-mobile .tabbar button:active > svg { transform: scale(.86); }
.is-mobile .tabbar button.wx-pop > svg { animation: kTabPop .5s var(--k-spring); }

/* Узкий телефон: текст, значки и кнопки меньше, первый экран не прячется под меню */
@media (max-width: 430px) {
  html.is-mobile body.wx-app .brand-name { font-size: 23px; }
  html.is-mobile body.wx-app .me-ava { width: 46px; height: 46px; }
  html.is-mobile .hm-hero { padding: 14px; }
  html.is-mobile .hm-hi { font-size: 12px; }
  html.is-mobile .hm-live { height: 22px; padding: 0 6px; gap: 4px; font-size: 10px; }
  html.is-mobile .hm-hero .ring { --ring: min(268px, 74vw); }
  html.is-mobile .hm-info h2 { font-size: 23px; }
  html.is-mobile .hm-info p { font-size: 12.5px; }
  html.is-mobile .hm-facts { margin-top: 12px; padding-top: 10px; }
  html.is-mobile .hm-facts dd { font-size: 17px; }
  html.is-mobile .hm-facts dt { letter-spacing: .02em; font-size: 9px; }
  html.is-mobile .hm-cta { margin-top: 12px; gap: 8px; }
  html.is-mobile .hm-primary { min-height: 54px; gap: 10px; padding: 8px 12px 8px 8px; border-radius: 16px; }
  html.is-mobile .hm-primary-ico { width: 36px; height: 36px; border-radius: 11px; }
  html.is-mobile .hm-primary-ico svg { width: 18px; height: 18px; }
  html.is-mobile .hm-primary-txt b { font-size: 14px; }
  html.is-mobile .hm-primary-txt small { font-size: 11px; }
  html.is-mobile .hm-primary-go { width: 16px; height: 16px; }
  html.is-mobile .hm-seg > * { height: 54px; gap: 4px; font-size: 11px; }
  html.is-mobile .hm-seg svg { width: 18px; height: 18px; }
  html.is-mobile .hm-stat { min-height: 112px; padding: 12px; gap: 8px; }
  html.is-mobile .hm-stat b { font-size: 24px; }
  html.is-mobile .hm-stat em { font-size: 11px; }
  html.is-mobile .hm-slot { width: 18px; height: 18px; border-radius: 6px; }
  html.is-mobile .hm-slot svg { width: 13px; height: 13px; }
  html.is-mobile .cab-ico,
  html.is-mobile .cab-alert-ico { width: 34px; height: 34px; border-radius: 10px; }
  html.is-mobile .cab-ico svg,
  html.is-mobile .cab-alert-ico svg { width: 16px; height: 16px; }
  html.is-mobile .cab-row { min-height: 54px; padding: 10px 12px; gap: 10px; }
  html.is-mobile .cab-main b { font-size: 13.5px; }
  html.is-mobile .cab-main small { font-size: 11.5px; }
  html.is-mobile .pane-head h2 { font-size: 22px; }
  html.is-mobile .pane-head p { font-size: 12.5px; }
  html.is-mobile .btn { height: 44px; padding: 0 16px; font-size: 14.5px; border-radius: 14px; }
  html.is-mobile .btn svg { width: 16px; height: 16px; }
  html.is-mobile .tabbar button { font-size: 9px; gap: 2px; }
  html.is-mobile .tabbar button > svg { width: 18px; height: 18px; }
  html.is-mobile #pane-devices .dev-slot.dv-row { grid-template-columns: 38px minmax(0, 1fr) auto; gap: 10px; padding: 12px; }
  html.is-mobile #pane-devices .dev-slot.dv-row .dev-os,
  html.is-mobile #pane-devices .dev-os[class*="is-"] { width: 38px; height: 38px; border-radius: 11px; }
  html.is-mobile #pane-devices .dev-os svg,
  html.is-mobile #pane-devices .dev-os svg.os-logo { width: 18px; height: 18px; }
html.is-mobile .app .pf-ava { width: 56px; height: 56px; }
html.is-mobile .app .pf-head { padding: 16px; gap: 14px; }
html.is-mobile .pf-role { letter-spacing: .08em; }
html.is-mobile .pf-pills button { padding: 11px 8px; }
html.is-mobile .pf-pills b { font-size: 13px; letter-spacing: -.03em; }
html.is-mobile .ph-sum small { font-size: 10px; }
}

/* Широкое окно с телефонной вёрсткой: колонка как у телефона, не на весь монитор */
html.is-mobile body.wx-app .top:has(#top-me) #burger { display: grid !important; }
/* Нижнее меню на телефоне спрятано, разметка на месте. */
html.is-mobile body.wx-app .tabbar { visibility: hidden !important; pointer-events: none !important; }
html.is-mobile body.wx-app .app { padding-bottom: calc(24px + var(--safe-b)); }
html.is-mobile body.wx-app .toast { bottom: calc(20px + var(--safe-b)); }
body.is-cab-nav { overflow: hidden; }
body.is-cab-nav .top { z-index: 90; }
html.is-chat body.wx-app.is-cab-nav .top,
html.is-chat body.wx-app.is-cab-nav .top::before {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.is-cab-nav .burger i:nth-child(1) { top: 21px; transform: rotate(45deg); }
body.is-cab-nav .burger i:nth-child(2) { opacity: 0; transform: scaleX(.3); }
body.is-cab-nav .burger i:nth-child(3) { top: 21px; transform: rotate(-45deg); }
.cab-nav { position: fixed; inset: 0; z-index: 80; }
.cab-nav[hidden] { display: none !important; }
.cab-nav-back { position: absolute; inset: 0; border: 0; padding: 0; background: rgba(0, 0, 0, .5); }
.cab-nav-card {
  position: absolute; top: 0; bottom: 0; left: 0; width: min(292px, 82%);
  display: flex; flex-direction: column; gap: 4px;
  padding: calc(72px + var(--safe-t)) 12px calc(16px + var(--safe-b));
  border-radius: 0 26px 26px 0;
  background: rgba(12, 12, 16, .94);
  border-right: 1px solid rgba(255, 255, 255, .1);
  box-shadow: 24px 0 60px rgba(0, 0, 0, .4);
  backdrop-filter: blur(18px);
}
.cab-nav-kicker {
  margin: 0 8px 8px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .45);
}
.cab-nav-card button {
  display: flex; align-items: center; gap: 12px; width: 100%; height: 48px;
  padding: 0 12px; border: 0; border-radius: 14px; background: transparent;
  color: #fff; font: 600 16px/1 Manrope, sans-serif; text-align: left; cursor: pointer;
}
.cab-nav-card button svg { width: 22px; height: 22px; flex: none; }
.cab-nav-card button.is-on { background: rgba(255, 255, 255, .1); }
.cab-nav-exit { margin-top: auto; color: rgba(255, 255, 255, .72); }
@media (min-width: 480px) {
  html.is-mobile body.wx-app {
    width: 390px;
    max-width: 390px;
    margin-inline: auto;
    min-height: 100dvh;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .08);
  }
  html.is-mobile body.wx-app .top {
    left: 50%;
    right: auto;
    width: 390px;
    transform: translateX(-50%);
  }
  html.is-mobile body.wx-app .cab-nav {
    left: 50%;
    right: auto;
    width: 390px;
    transform: translateX(-50%);
  }
}
html.is-mobile .hm-hero .ring { --ring: min(268px, 74vw); }
@media (max-width: 430px) and (max-height: 740px) {
  html.is-mobile .hm-hero .ring { --ring: min(248px, 70vw); }
  html.is-mobile .hm-info h2 { font-size: 21px; margin-top: 4px; }
  html.is-mobile .hm-info p { margin-top: 4px; }
  html.is-mobile .hm-facts { margin-top: 8px; }
  html.is-mobile .hm-cta { margin-top: 8px; }
}

/* Телефон: устройства и подключение ближе к одному экрану */
html.is-mobile #pane-devices .pane-head,
html.is-mobile #pane-connect .pane-head { margin-bottom: 8px; }
html.is-mobile #pane-devices .dv-sum { margin-bottom: 8px; padding: 12px 14px; }
html.is-mobile #pane-devices .dev-slot.dv-row { padding: 11px 12px; gap: 10px; }
html.is-mobile #pane-devices .dv-free { padding: 11px 12px; gap: 10px; }
html.is-mobile #pane-connect.port-screen.is-on { gap: 8px; }
html.is-mobile #pane-connect .sp-track { --sp-dot: 46px; padding-top: 10px; padding-bottom: 8px; }
html.is-mobile #pane-connect .sp-card { padding: 14px 14px 10px; }
html.is-mobile #pane-connect .sp-step { gap: 8px; }
html.is-mobile #pane-connect .sp-step h2 { font-size: 22px; }
html.is-mobile #pane-connect .sp-lead { font-size: 13px; line-height: 1.35; }
html.is-mobile #pane-connect .sp-choices { grid-template-columns: 1fr; gap: 8px; }
html.is-mobile #pane-connect .sp-choice { min-height: 64px; padding: 8px 12px; }
html.is-mobile #pane-connect .sp-choice-copy strong { font-size: 15px; }
html.is-mobile #pane-connect .sp-choice-copy small { font-size: 12px; }
html.is-mobile #pane-connect .sp-sub { margin-top: 2px; padding: 12px; }
html.is-mobile #pane-connect .sp-sub-note { font-size: 12.5px; line-height: 1.35; }
html.is-mobile #pane-connect .sp-nav { margin-top: 8px; padding-top: 8px; }
html.is-mobile #pane-connect .sp-os { gap: 6px; }
html.is-mobile #pane-connect .sp-os button { min-height: 58px; }
html.is-mobile #pane-connect .sp-final-qr svg { width: 160px; height: 160px; }

/* --- Появление разделов --- */
.app .pane.is-on > *,
.app #pane-home.is-on .hm > * { animation: cabRise .55s var(--k-ease) both; }
.app .pane.is-on > :nth-child(2), .app #pane-home.is-on .hm > :nth-child(2) { animation-delay: .05s; }
.app .pane.is-on > :nth-child(3), .app #pane-home.is-on .hm > :nth-child(3) { animation-delay: .1s; }
.app .pane.is-on > :nth-child(4), .app #pane-home.is-on .hm > :nth-child(4) { animation-delay: .15s; }
.app .pane.is-on > :nth-child(5), .app #pane-home.is-on .hm > :nth-child(5) { animation-delay: .2s; }
.app #pane-home.is-on .hm > :nth-child(6) { animation-delay: .25s; }
.app #pane-home.is-on > .hm { animation: none; }
.app.is-settled .pane.is-on > *,
.app.is-settled #pane-home.is-on .hm > * { animation: none; }
body.is-arriving .top { animation: kArriveTop .55s var(--k-ease) .04s both; }
body.is-arriving .app.is-settled #pane-home.is-on .hm > * { animation: cabRise .62s var(--k-ease) both; }
body.is-arriving .app.is-settled #pane-home.is-on .hm > :nth-child(2) { animation-delay: .06s; }
body.is-arriving .app.is-settled #pane-home.is-on .hm > :nth-child(3) { animation-delay: .11s; }
body.is-arriving .app.is-settled #pane-home.is-on .hm > :nth-child(4) { animation-delay: .16s; }
body.is-arriving .app.is-settled #pane-home.is-on .hm > :nth-child(5) { animation-delay: .21s; }
body.is-arriving .app.is-settled #pane-home.is-on .hm > :nth-child(6) { animation-delay: .26s; }
@keyframes kArriveTop { from { opacity: 0; translate: 0 -8px; } to { opacity: 1; translate: 0 0; } }
@media (prefers-reduced-motion: reduce) {
  body.is-arriving .top,
  body.is-arriving .app.is-settled #pane-home.is-on .hm > * { animation: none; }
}

/* --- Гиперпрыжок: скрытая анимация по 5 нажатиям на логотип --- */
.k-warp {
  position: fixed; inset: 0; z-index: 200; pointer-events: auto; touch-action: none;
  background: radial-gradient(circle at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .55) 100%);
  animation: kWarpFade 1.9s var(--k-ease) forwards;
}
.k-warp canvas { width: 100%; height: 100%; }
html:has(body.k-warping),
body.k-warping { overflow: hidden; overscroll-behavior: none; }
body.k-warping .app { animation: kWarpShake 1.6s var(--k-ease); }

@keyframes cabRise { from { opacity: 0; transform: translateY(10px); filter: blur(2px); } }
@keyframes cabMeter { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes kPing { 0% { transform: scale(.6); opacity: .9; } 80%, 100% { transform: scale(1.8); opacity: 0; } }
@keyframes kSheen { 0% { transform: translateX(-120%); } 18%, 100% { transform: translateX(120%); } }
@keyframes kTabPop { 0% { transform: scale(.8); } 60% { transform: scale(1.12) translateY(-2px); } 100% { transform: translateY(-1px); } }
@keyframes kWarpFade { 0% { opacity: 0; } 12% { opacity: 1; } 78% { opacity: 1; } 100% { opacity: 0; } }
@keyframes kWarpShake { 0%, 100% { transform: none; } 20% { transform: scale(.985); } 55% { transform: scale(1.01); } }
@keyframes kScramble { 0% { opacity: .5; } 100% { opacity: 1; } }

html.is-paused .k-tw,
html.is-paused .k-planet::before,
html.is-paused .k-moon,
html.is-paused .k-saturn svg,
html.is-paused .k-shoot,
html.is-paused .hm-flags-track,
html.is-paused .tg-hello-sky > i,
html.is-paused .tg-hello-orbit,
html.is-paused .brand-space i,
html.is-paused .brand-name b,
html.is-paused .me-ava::before,
html.is-paused .app .ring::after { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .hm-flags-track,
  .hm-primary::after,
  .hm-live.is-on i::after,
  .hm-count i::after { animation: none !important; }
  .is-mobile .tabbar-glide { transition: none; }
  .gpt-caret, .gpt-dots i { animation: none; }
}

/* --- ChatGPT 6 в кабинете --- */
/* --- ChatGPT: белый шар, тот же узел и движение, что в приложении --- */
body.wx-app .gpt-orb {
  position: relative; display: grid; place-items: center; overflow: visible; isolation: isolate;
  width: 44px; height: 44px; flex: none; margin: 0; border-radius: 50%;
  background: var(--k-white); color: #111;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .28), inset 0 1px 0 #fff;
}
body.wx-app .gpt-orb--lg {
  width: 92px; height: 92px;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .4), inset 0 1px 0 #fff;
  animation: gptOrb 5s ease-in-out infinite;
}
body.wx-app .gpt-orb i {
  position: absolute; inset: -10px; border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 50%; pointer-events: none; animation: gptHalo 3.6s ease-out infinite;
}
body.wx-app .gpt-orb i:nth-child(2) { animation-delay: 1.2s; }
body.wx-app .gpt-orb i:nth-child(3) { animation-delay: 2.4s; }
body.wx-app .gpt-knot {
  position: relative; z-index: 2; display: block; width: 54%; height: 54%;
  background: none; mask: none; -webkit-mask: none; filter: none;
  fill: currentColor; animation: gptKnotSpin 16s linear infinite, gptKnotBreath 3.2s ease-in-out infinite;
}
body.wx-app .gpt-orb-shine {
  position: absolute; inset: 0; z-index: 3; overflow: hidden; border-radius: 50%;
  pointer-events: none; text-decoration: none;
}
body.wx-app .gpt-orb-shine::after {
  content: ""; position: absolute; top: -20%; bottom: -20%; left: -60%; width: 42%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .95), transparent);
  transform: skewX(-18deg); animation: gptOrbShine 4.2s 1s ease-in-out infinite;
}
body.wx-app .gpt-orb-orbit {
  position: absolute; inset: -16px; z-index: 4; border-radius: 50%; pointer-events: none;
  animation: gptKnotSpin 9s linear infinite;
}
body.wx-app .gpt-orb-orbit em {
  position: absolute; width: 5px; height: 5px; border-radius: 50%; background: #fff;
  box-shadow: 0 0 8px 1px rgba(255, 255, 255, .85); animation: gptTwinkle 1.8s ease-in-out infinite;
}
body.wx-app .gpt-orb-orbit em:nth-child(1) { top: -2px; left: 50%; margin-left: -2px; }
body.wx-app .gpt-orb-orbit em:nth-child(2) { bottom: 12%; right: 2%; width: 4px; height: 4px; animation-delay: .6s; }
body.wx-app .gpt-orb-orbit em:nth-child(3) { bottom: 16%; left: 1%; width: 3px; height: 3px; animation-delay: 1.2s; }
body.wx-app .cab-ico.gpt-orb {
  width: 40px; height: 40px; border-radius: 50%; border-color: transparent;
  background: var(--k-white); color: #111; box-shadow: inset 0 1px 0 #fff;
}
@keyframes gptOrb {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
@keyframes gptHalo {
  0% { transform: scale(.86); opacity: .7; }
  100% { transform: scale(1.45); opacity: 0; }
}
@keyframes gptKnotSpin { to { rotate: 360deg; } }
@keyframes gptKnotBreath {
  0%, 100% { scale: .94; }
  50% { scale: 1.06; }
}
@keyframes gptOrbShine {
  0%, 55% { left: -60%; }
  85%, 100% { left: 130%; }
}
@keyframes gptTwinkle {
  0%, 100% { opacity: .35; }
  50% { opacity: 1; }
}
.hm-free {
  flex: none; padding: 4px 9px; border-radius: 999px; background: #fff; color: #111;
  font-size: 11px; font-weight: 800; font-style: normal; letter-spacing: -.01em;
}
.cab-ico.gpt-orb svg { width: 22px; height: 22px; }
#pane-chat.is-on {
  position: relative;
  display: flex; flex-direction: column; gap: 0; min-height: calc(100dvh - 168px);
  height: calc(100dvh - 168px); min-width: 0; overflow: hidden;
  padding: 12px 16px 14px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 28px;
  background: #060607;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 24px 60px rgba(0, 0, 0, .35);
}
html.is-chat body.wx-app .top,
html.is-chat body.wx-app .top::before {
  background: #060607 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#pane-chat.is-on::before { display: none; }
#pane-chat.is-on > * { position: relative; z-index: 1; }
#pane-chat.is-on > .gpt-drawer { position: absolute; inset: 0; z-index: 40; }
.is-desktop .panes:has(#pane-chat.is-on) {
  --chat-head: clamp(16px, 2vh, 28px);
  padding-top: var(--chat-head);
}
.is-desktop #pane-chat.is-on {
  height: max(520px, calc(100dvh - 168px - var(--chat-head, 0px)));
  min-height: 0;
  margin-top: 0;
}
.gpt-head {
  display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center; gap: 8px; padding: 2px 0 12px;
}
.gpt-side { display: flex; align-items: center; gap: 2px; min-width: 0; }
.gpt-side-end { justify-content: flex-end; }
.gpt-kicker {
  justify-self: center; display: inline-flex; align-items: center; gap: 8px; margin: 0;
  color: #111; background: #fff; border-radius: 999px; padding: 8px 14px 8px 12px;
  font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  box-shadow: inset 0 1px 0 #fff;
}
.gpt-kicker i { width: 7px; height: 7px; border-radius: 50%; background: #16a34a; box-shadow: 0 0 0 3px rgba(22, 163, 74, .16); }
.gpt-side button {
  display: grid; place-items: center; width: 40px; height: 40px; margin: 0;
  border: 0; border-radius: 13px; background: transparent; color: #fff;
}
.gpt-side svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.gpt-full-exit { display: none; }
body.is-gpt-full .gpt-full-enter { display: none; }
body.is-gpt-full .gpt-full-exit { display: block; }
@media (hover: hover) {
  .gpt-side button:hover { background: rgba(255, 255, 255, .08); }
}
html.is-mobile .gpt-head { padding: 0 0 8px; }
html.is-mobile .gpt-kicker { gap: 6px; padding: 5px 10px 5px 8px; font-size: 10px; letter-spacing: .06em; }
html.is-mobile .gpt-kicker i { width: 5px; height: 5px; box-shadow: 0 0 0 2px rgba(22, 163, 74, .16); }
html.is-mobile .gpt-side button { width: 36px; height: 36px; }
html.is-mobile .gpt-side svg { width: 19px; height: 19px; }
.gpt-stage { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
#pane-chat.is-on .gpt-log {
  position: absolute;
  inset: 0;
  width: auto;
  max-width: none;
}
.gpt-empty {
  margin: auto; transform: translateY(-56px);
  display: grid; justify-items: center; gap: 10px; width: min(560px, 100%);
  padding: 12px 0 24px; text-align: center;
}
.gpt-empty h3 { margin: 6px 0 0; font-family: var(--wx-head); font-weight: 650; letter-spacing: -.04em; font-size: clamp(26px, 3vw, 34px); color: #fff; }
.gpt-empty p { margin: 0; color: var(--k-dim); font-size: 15px; line-height: 1.45; }
.gpt-ideas { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; margin-top: 8px; }
.gpt-ideas button {
  display: grid; gap: 3px; padding: 14px 16px; text-align: left;
  border: 1px solid rgba(255, 255, 255, .22); border-radius: 18px;
  background: rgba(255, 255, 255, .07); color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18);
  backdrop-filter: blur(18px) saturate(150%);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
}
.gpt-ideas b { font-family: var(--wx-head); font-weight: 650; letter-spacing: -.03em; font-size: 15px; }
.gpt-ideas small { color: #c8c8d0; font-size: 12.5px; font-weight: 650; }
@media (hover: hover) {
  .gpt-ideas button:hover { border-color: rgba(255, 255, 255, .5); background: rgba(28, 28, 34, .94); }
}
.gpt-log {
  flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: flex-start;
  gap: 16px; overflow-x: hidden; overflow-y: auto; padding: 8px 2px 12px;
}
.gpt-msg.is-user { align-self: flex-end; }
.gpt-msg.is-assistant { align-self: flex-start; }
.gpt-msg { display: grid; gap: 6px; max-width: min(640px, 100%); }
.gpt-msg.is-user { justify-self: end; }
.gpt-msg.is-assistant { justify-self: start; }
.gpt-msg header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.gpt-msg header b { font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--k-mute); }
.gpt-msg header button { color: var(--k-dim); font-size: 12px; font-weight: 750; }
.gpt-acts { display: flex; align-items: center; gap: 2px; margin-top: 4px; }
.gpt-msg.is-user .gpt-acts { justify-content: flex-end; }
.gpt-acts button {
  display: grid; place-items: center; width: 28px; height: 28px; margin: 0; padding: 0;
  border: 0; border-radius: 6px; background: transparent; color: #8d8d96;
}
.gpt-acts button:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.gpt-acts svg {
  width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
}
.gpt-body { padding: 14px 16px; border: 1px solid var(--k-line); border-radius: 18px; background: #141418; color: #fff; }
.gpt-msg.is-user .gpt-body { background: #fff; color: #111; border-color: transparent; border-bottom-right-radius: 6px; }
.gpt-msg.is-assistant .gpt-body { border-bottom-left-radius: 6px; }
.gpt-body p { margin: 0 0 8px; line-height: 1.55; }
.gpt-body p:last-child { margin-bottom: 0; }
.gpt-body h4 { margin: 12px 0 6px; font-family: var(--wx-head); font-size: 16px; letter-spacing: -.03em; }
.gpt-body ul { margin: 0 0 8px; padding-left: 18px; }
.gpt-body li { margin: 2px 0; line-height: 1.45; }
.gpt-body code { padding: 1px 5px; border-radius: 6px; background: rgba(255, 255, 255, .08); font-family: ui-monospace, Consolas, monospace; font-size: .92em; }
.gpt-msg.is-user code { background: rgba(0, 0, 0, .08); }
.gpt-body pre { margin: 0 0 8px; padding: 12px; overflow: auto; border-radius: 12px; background: #050506; color: #f5f5f6; }
.gpt-body a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.gpt-shots { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.gpt-shots img { width: 92px; height: 92px; object-fit: cover; border-radius: 12px; }
.gpt-dots {
  display: inline-flex; align-items: center; gap: 5px; height: 18px; padding: 2px 0;
}
.gpt-dots i {
  width: 7px; height: 7px; border-radius: 50%; background: #fff;
  animation: gptDot 1s ease-in-out infinite;
}
.gpt-dots i:nth-child(2) { animation-delay: .15s; }
.gpt-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes gptDot {
  0%, 80%, 100% { transform: translateY(0); opacity: .35; }
  40% { transform: translateY(-4px); opacity: 1; }
}
.gpt-caret {
  display: inline-block; width: 8px; height: 8px; margin-left: 4px; vertical-align: 1px;
  border-radius: 50%; background: #fff; box-shadow: 0 0 10px rgba(255, 255, 255, .85);
  animation: gptCaret .9s ease-in-out infinite;
}
@keyframes gptCaret {
  0%, 100% { transform: scale(.7); opacity: .55; }
  50% { transform: scale(1); opacity: 1; }
}
.gpt-down {
  position: absolute; right: 8px; bottom: 10px; z-index: 2;
  display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
  border: 1px solid var(--k-line-2); background: #fff; color: #111;
  box-shadow: 0 8px 20px rgba(0, 0, 0, .35);
}
#pane-chat.is-on .gpt-down {
  right: 14px;
  bottom: 8px;
}
html.is-desktop #pane-chat .gpt-down,
html.is-desktop #pane-chat.is-on .gpt-down {
  right: 22px;
  bottom: 10px;
}
.gpt-down[hidden] { display: none; }
.gpt-down svg { width: 16px; height: 16px; transform: rotate(90deg); }
.gpt-bar {
  position: sticky; bottom: 0; display: grid; gap: 6px; margin-top: 8px; padding: 8px;
  border: 1px solid var(--k-line-2); border-radius: 22px; background: #101013;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .4);
}
.gpt-count {
  justify-self: end; margin: 0 6px 2px 0;
  color: #8d8d96; font: 650 12px/1 Manrope, sans-serif; font-variant-numeric: tabular-nums;
}
.gpt-count.is-max { color: #ff4d5e; }
.gpt-files { display: flex; flex-wrap: wrap; gap: 8px; }
.gpt-files span { position: relative; display: grid; }
.gpt-files img { width: 64px; height: 64px; object-fit: cover; border-radius: 12px; }
.gpt-files .is-file { place-items: center; min-width: 120px; padding: 8px 28px 8px 10px; border-radius: 12px; background: rgba(255, 255, 255, .04); color: #fff; font-size: 12px; }
.gpt-files button { position: absolute; top: 4px; right: 4px; width: 18px; height: 18px; border-radius: 50%; background: #fff; color: #111; font-weight: 800; }
.gpt-compose { display: flex; align-items: center; gap: 8px; }
.gpt-field { display: flex; align-items: center; flex: 1; min-width: 0; }
.gpt-field textarea {
  display: block; width: 100%; height: 24px; min-height: 24px; max-height: 160px; margin: 0; resize: none;
  border: 0; outline: none; background: transparent; color: #fff; box-sizing: border-box;
  font: 600 16px/20px Manrope, sans-serif; padding: 2px 2px; overflow: hidden;
  align-self: center; caret-color: #fff; -webkit-appearance: none; appearance: none;
}
.gpt-field textarea::placeholder { color: var(--k-mute); }
.gpt-plus, .gpt-send {
  display: grid; place-items: center; align-self: center; width: 40px; height: 40px; margin: 0;
  flex: none; border-radius: 14px;
}
.gpt-plus { border: 1px solid var(--k-line-2); background: rgba(255, 255, 255, .03); color: #fff; }
.gpt-plus svg, .gpt-send svg { width: 18px; height: 18px; }
.gpt-send { background: var(--k-white); color: var(--k-ink); box-shadow: inset 0 1px 0 #fff; }
.gpt-send svg { transform: rotate(-90deg); }
.gpt-send:disabled { opacity: .35; }
.gpt-send.is-stop .gpt-go { display: none; }
.gpt-send.is-stop::before { content: ""; width: 12px; height: 12px; border-radius: 3px; background: #111; }
.gpt-drawer {
  position: absolute; inset: 0; z-index: 30; display: block; padding: 0;
  overflow: hidden; border-radius: inherit;
  background: rgba(0, 0, 0, .4);
}
.gpt-drawer[hidden] { display: none; }
.gpt-drawer-back { position: absolute; inset: 0; border: 0; background: transparent; }
.gpt-drawer-card {
  position: absolute; top: 0; bottom: 0; left: 0;
  display: flex; flex-direction: column;
  width: min(320px, 88%); max-height: none; overflow: hidden;
  margin: 0; padding: 16px 14px;
  border: 0; border-right: 1px solid var(--k-line-2); border-radius: 28px 0 0 28px;
  background: #101013;
  box-shadow: 18px 0 40px rgba(0, 0, 0, .4);
  transform: translateX(-105%);
}
body.is-gpt-full .gpt-drawer-card { border-radius: 0 26px 26px 0; width: min(84vw, 360px); }
.gpt-drawer.is-on .gpt-drawer-card { animation: gptSlide .36s cubic-bezier(.2, 1, .3, 1) both; }
@keyframes gptSlide { from { transform: translateX(-105%); } to { transform: none; } }
.gpt-drawer-card header { display: flex; align-items: center; justify-content: space-between; color: #fff; }
.gpt-drawer-card header b { font-family: var(--wx-head); font-size: 22px; font-weight: 650; }
.gpt-drawer-card header button { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; color: #fff; }
.gpt-drawer-card header svg { width: 16px; height: 16px; }
.gpt-drawer [data-gpt="list"] { flex: 1; min-height: 0; overflow: auto; margin-top: 4px; }
.gpt-drawer-new, .gpt-row {
  display: flex; align-items: center; gap: 8px; width: 100%; margin-top: 8px; padding: 12px; border-radius: 14px;
  border: 1px solid var(--k-line); background: rgba(255, 255, 255, .03); color: #fff; text-align: left;
}
.gpt-drawer-new { justify-content: center; background: var(--k-white); color: var(--k-ink); font-weight: 800; }
.gpt-drawer .gpt-row {
  position: relative; display: block; width: auto; margin-top: 8px; padding: 10px 12px 12px;
}
.gpt-drawer .gpt-row-open {
  display: grid; gap: 10px; width: 100%; min-width: 0; padding: 0 40px 0 0;
  border: 0; background: none; color: #fff; text-align: left;
}
.gpt-drawer .gpt-row-open b {
  display: flex; align-items: center; min-height: 32px; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; font-size: 15px; font-weight: 700; line-height: 1.2;
}
.gpt-drawer .gpt-row-meta { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; }
.gpt-drawer .gpt-row-meta > span { display: inline-flex; align-items: baseline; gap: 6px; flex: none; }
.gpt-drawer .gpt-row-meta i {
  position: relative; flex: 1; min-width: 28px; height: 4px; border-radius: 999px;
  background: rgba(255, 255, 255, .12);
}
.gpt-drawer .gpt-row-meta i::before {
  content: ""; position: absolute; inset: 0 auto 0 0; width: var(--p, 0%);
  border-radius: inherit; background: rgba(255, 255, 255, .7);
}
.gpt-drawer .gpt-row-meta em {
  font-style: normal; font-size: 11px; font-weight: 650; color: #9a9aa3; white-space: nowrap;
}
.gpt-drawer .gpt-row-meta small {
  font-size: 11px; font-weight: 750; color: rgba(255, 255, 255, .78); white-space: nowrap;
}
.gpt-drawer .gpt-row-del {
  position: absolute; top: 10px; right: 8px;
  display: grid; place-items: center; width: 32px; height: 32px; margin: 0; padding: 0;
  border: 1px solid rgba(255, 255, 255, .16); border-radius: 8px;
  background: rgba(255, 255, 255, .06); color: rgba(255, 255, 255, .9);
}
.gpt-drawer .gpt-row-del svg {
  width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
}
.gpt-drawer .gpt-row.is-on { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .28); }
.gpt-row b { display: block; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gpt-row small, .gpt-drawer-card > p, .gpt-none { color: var(--k-mute); font-size: 12px; }
.gpt-row [data-gpt-del] { flex: none; color: #a3a3ab; font-size: 12px; font-weight: 750; }
html.is-mobile .panes:has(#pane-chat.is-on) {
  padding-top: 0;
}
html.is-mobile #pane-chat.is-on {
  position: fixed;
  z-index: 5;
  left: 10px;
  right: 10px;
  top: calc(70px + var(--safe-t, 0px));
  bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  display: flex !important;
  flex-direction: column;
  width: auto;
  height: auto;
  max-height: none;
  min-height: 0 !important;
  margin: 0;
  overflow: hidden;
  padding: 12px 12px 14px;
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, .16);
  background: #060607 !important;
}
html.is-chat body.wx-app .k-cosmos,
html.is-chat body.wx-app .k-flow,
html.is-chat body.wx-app .k-world,
html.is-chat body.wx-app .k-saturn,
html.is-chat body.wx-app .k-tw,
html.is-chat body.wx-app .shoot,
html.is-chat body.wx-app .k-shoot,
html.is-chat body.wx-app .wx-noise {
  visibility: hidden;
  display: none;
}
#pane-chat.is-on .gpt-log::before {
  content: "";
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
}
html.is-mobile #pane-chat .gpt-stage { flex: 1; min-height: 0; overflow: hidden; }
html.is-mobile #pane-chat .gpt-log {
  flex: 1 1 auto; min-height: 0; overflow-x: hidden; overflow-y: auto;
  -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  touch-action: pan-y;
}
html.is-mobile #pane-chat .gpt-bar { position: relative; bottom: auto; flex: none; margin-top: 8px; padding: 6px; border-radius: 18px; }
.gpt-more { display: none; }
html.is-mobile .gpt-more {
  display: inline-block; width: fit-content; margin: 10px 0 0; padding: 0;
  border: 0; background: none; border-radius: 0;
  color: #a3a3ab; font: 600 14px/1.3 Manrope, sans-serif;
  text-decoration: underline; text-underline-offset: 3px;
}
html.is-mobile .gpt-more:active { color: #fff; }
html.is-mobile .gpt-body.is-clamp:not(.is-open) .gpt-clamp {
  position: relative; max-height: 240px; overflow: hidden;
}
html.is-mobile .gpt-body.is-clamp:not(.is-open) .gpt-clamp::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 48px; pointer-events: none;
  background: linear-gradient(transparent, #141418);
}
html.is-mobile .gpt-empty {
  width: 100%;
  gap: 8px;
  margin: 0;
  padding: 0 0 8px;
  transform: none;
}
html.is-mobile .gpt-empty h3 { font-size: 22px; line-height: 1.15; }
html.is-mobile .gpt-empty p { font-size: 13px; line-height: 1.35; }
html.is-mobile body.wx-app .gpt-orb--lg { width: 64px; height: 64px; }
html.is-mobile .gpt-ideas { grid-template-columns: 1fr; gap: 8px; margin-top: 4px; }
html.is-mobile .gpt-ideas button {
  display: grid; justify-items: start; gap: 2px;
  padding: 11px 14px; border-radius: 16px;
}
html.is-mobile .gpt-ideas b { font-size: 15px; white-space: nowrap; }
html.is-mobile .gpt-ideas small { font-size: 12px; text-align: left; white-space: nowrap; }
html.is-mobile body.wx-app main:has(#pane-chat.is-on) { padding-left: 10px; padding-right: 10px; }
html.is-mobile .gpt-drawer { border-radius: inherit; }
html.is-mobile .gpt-drawer-card { border-radius: 28px 22px 22px 28px; }
html.is-mobile #pane-chat .gpt-plus,
html.is-mobile #pane-chat .gpt-send { width: 36px; height: 36px; border-radius: 12px; }
html.is-mobile #pane-chat .gpt-field textarea,
html.is-ios #pane-chat .gpt-field textarea {
  height: 24px;
  min-height: 24px;
  padding: 2px 2px;
  font-size: 16px;
  line-height: 20px;
  overflow: hidden;
}
#pane-chat .gpt-log {
  width: 100%; max-width: none; min-width: 0;
  overflow-x: hidden; overflow-y: auto;
  overflow-anchor: none;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .28) transparent;
  -webkit-mask-image: none; mask-image: none;
}
#pane-chat .gpt-log::-webkit-scrollbar { width: 8px; height: 8px; background: transparent; }
#pane-chat .gpt-log::-webkit-scrollbar-thumb {
  border: 2px solid transparent; border-radius: 999px; background-clip: padding-box;
  background: rgba(255, 255, 255, .28); box-shadow: none;
}
#pane-chat .gpt-msg {
  width: fit-content; max-width: min(680px, 100%); min-width: 0;
}
#pane-chat .gpt-body { min-width: 0; overflow-wrap: anywhere; }
#pane-chat .gpt-body img {
  display: block; width: auto; height: auto;
  max-width: min(220px, 100%); max-height: 220px;
  object-fit: contain; border-radius: 12px;
}
#pane-chat .gpt-shots img { width: 92px; height: 92px; object-fit: cover; }
body.is-gpt-full,
html:has(body.is-gpt-full) { overflow: hidden; }
body.is-gpt-full .top,
body.is-gpt-full .side,
body.is-gpt-full .tabbar,
body.is-gpt-full .tg-bar { display: none !important; }
body.is-gpt-full #pane-chat.is-on::before { display: none; }
html.is-mobile body.is-gpt-full #pane-chat.is-on,
body.is-gpt-full #pane-chat.is-on {
  position: fixed; inset: 0; z-index: 90;
  width: 100%; max-width: none; height: 100dvh; min-height: 0; margin: 0;
  padding: calc(12px + var(--safe-t, 0px)) clamp(16px, 2.4vw, 32px) calc(12px + var(--safe-b, 0px));
  border: 0; border-radius: 0;
  background: #060607;
  box-shadow: none;
  backdrop-filter: none;
}
html.is-mobile body.is-gpt-full #pane-chat.is-on {
  bottom: auto;
  height: 100svh;
}
body.is-gpt-full #pane-chat .gpt-stage,
body.is-gpt-full #pane-chat .gpt-head,
body.is-gpt-full #pane-chat .gpt-bar {
  width: 100%; max-width: none; margin-inline: 0;
}
html.is-desktop body.is-gpt-full #pane-chat .gpt-bar {
  width: min(760px, 100%);
  max-width: 760px;
  margin-inline: auto;
}
html.is-desktop body.is-gpt-full #pane-chat .gpt-down {
  right: max(22px, calc((100% - 760px) / 2 + 14px));
  bottom: 16px;
}
body.is-gpt-full #pane-chat .gpt-stage { min-height: 0; flex: 1; }
body.is-gpt-full #pane-chat .gpt-bar { position: sticky; bottom: 0; }
body.is-gpt-full #pane-chat .gpt-msg { max-width: min(880px, 100%); }
body.is-gpt-full #pane-chat .gpt-log {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .28) transparent;
}
body.is-gpt-full #pane-chat .gpt-log::-webkit-scrollbar { width: 8px; background: transparent; }
body.is-gpt-full #pane-chat .gpt-log::-webkit-scrollbar-thumb {
  border: 2px solid transparent; border-radius: 999px; background-clip: padding-box;
  background: rgba(255, 255, 255, .28); box-shadow: none;
}

/* --- Карточка уведомления: белая, как кабинет --- */
.af-note {
  position: fixed; z-index: 240; left: 50%; top: calc(84px + var(--safe-t, 0px));
  width: min(400px, calc(100% - 24px)); transform: translateX(-50%);
  cursor: pointer; user-select: none;
}
html.is-desktop .af-note { top: calc(96px + var(--safe-t, 0px)); }
html.in-tg-desk .af-note { top: calc(var(--tg-head, 76px) + 14px); }
.af-note[hidden] { display: none; }
.af-note-card {
  position: relative; overflow: hidden; display: grid; gap: 10px;
  padding: 16px 16px 20px; border-radius: 22px;
  background: var(--k-white); color: var(--k-ink);
  box-shadow: 0 22px 50px rgba(0, 0, 0, .48), inset 0 1px 0 #fff;
}
.af-note.is-in .af-note-card { animation: afNoteIn .42s var(--k-spring); }
.af-note.is-out .af-note-card { animation: afNoteOut .22s ease forwards; }
.af-note header { display: flex; align-items: center; gap: 10px; }
.af-note-ico {
  display: grid; place-items: center; width: 34px; height: 34px; flex: none; border-radius: 11px;
  background: #111; color: #fff;
}
.af-note-ico svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.af-note-ico .st-rk { width: 20px; height: 20px; margin: 0; }
.af-note header [data-note-kicker] {
  min-width: 0; font: 800 10.5px/1 Unbounded, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: #6e6e77;
}
.af-note header button {
  margin-left: auto; display: grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 50%;
  background: rgba(0, 0, 0, .06); color: #111; cursor: pointer;
}
.af-note header button svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.af-note [data-note-title] {
  font-family: var(--wx-head); font-weight: 650; letter-spacing: -.03em; font-size: 17px; line-height: 1.2;
}
.af-note-hero { display: grid; gap: 4px; margin: 0; }
.af-note-hero[hidden] { display: none; }
.af-note-hero i {
  color: #6e6e77; font-size: 12px; font-style: normal; font-weight: 750; letter-spacing: -.01em;
}
.af-note-hero b {
  display: flex; align-items: center; gap: 6px;
  font: 650 40px/1 var(--wx-head); letter-spacing: -.05em; font-variant-numeric: tabular-nums;
}
.af-note-hero .st-rk { width: 30px; height: 30px; margin: 0; }
.af-note-rows { display: grid; border-top: 1px solid rgba(0, 0, 0, .08); }
.af-note-rows[hidden] { display: none; }
.af-note-rows span {
  display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
  padding: 8px 0; border-bottom: 1px solid rgba(0, 0, 0, .06); font-size: 13.5px;
}
.af-note-rows span:last-child { border-bottom: 0; padding-bottom: 0; }
.af-note-rows i { color: #6e6e77; font-style: normal; font-weight: 700; }
.af-note-rows b { display: inline-flex; align-items: center; gap: 4px; font-weight: 800; text-align: right; }
.af-note-rows .st-rk { width: 15px; height: 15px; margin: 0; }
.af-note-text { margin: 0; color: #3a3a42; font-size: 13.5px; font-weight: 650; line-height: 1.45; }
.af-note-text[hidden] { display: none; }
.af-note-text .st-rk { width: 15px; height: 15px; margin: 0 .08em; vertical-align: -0.22em; }
.af-note-bar {
  position: absolute; left: 16px; right: 16px; bottom: 8px; height: 2px; border-radius: 2px;
  background: #111; transform-origin: left center; transform: scaleX(1);
}
.af-note-bar.is-on { animation: afNoteBar 8s linear forwards; }
@keyframes afNoteIn { from { opacity: 0; transform: translateY(-16px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes afNoteOut { to { opacity: 0; transform: translateY(-12px); } }
@keyframes afNoteBar { to { transform: scaleX(0); } }
@media (prefers-reduced-motion: reduce) {
  .af-note.is-in .af-note-card, .af-note.is-out .af-note-card, .af-note-bar.is-on { animation: none; }
}
@keyframes gptShine { 0%, 62% { background-position: 140% 0; } 100% { background-position: -40% 0; } }
@media (prefers-reduced-motion: reduce) {
  .gpt-caret, .gpt-dots i, .gpt-knot, .gpt-orb--lg, .gpt-orb i, .gpt-orb-orbit, .gpt-orb-shine::after,
  .gpt-drawer.is-on .gpt-drawer-card { animation: none; }
  .gpt-drawer.is-on .gpt-drawer-card { transform: none; }
}

html.is-app:not(.is-ios) { --safe-b: 20px; }
html.is-app body.wx-app .top,
html.is-app body.wx-app .top::before {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html.is-chat body.wx-app .top,
html.is-chat body.wx-app .top::before {
  background: #060607 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html.is-app body.wx-app .me-ava {
  box-shadow: 0 0 0 1.5px #fff;
}
html.is-app body.wx-app .me-ava img {
  -webkit-mask-image: none;
  mask-image: none;
}
html.is-app body.wx-app .me-ava::before { display: none; }
html.is-app .burger {
  background: #16161a;
  border-color: rgba(255, 255, 255, .28);
  box-shadow: none;
}
html.is-app .burger i {
  background: #fff;
  box-shadow: none;
}
html.is-app #auth-page.ap { padding-bottom: calc(18px + var(--safe-b, 0px)); }
html.is-app #pane-chat.is-on,
html.is-app body.is-gpt-full #pane-chat.is-on {
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, .16);
}
html.is-app.is-mobile #pane-chat.is-on {
  bottom: calc(12px + var(--safe-b, 0px));
}
html.is-app body.is-gpt-full #pane-chat.is-on {
  inset: 10px 10px calc(12px + var(--safe-b, 0px)) 10px;
  width: auto;
  height: auto;
}
html.is-app .pay-card,
html.is-app .layer-card {
  border-radius: 28px;
  width: calc(100% - 16px);
  margin-bottom: 12px;
}

/* Пополнение: промокод не действует — поле закрыто красным. */
[data-pay-promo].is-locked .pay-promo-lock {
  padding: 10px 12px;
  border: 1px solid rgba(255, 110, 110, 0.55);
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(255, 90, 90, 0.12), rgba(255, 90, 90, 0.03));
}
[data-pay-promo].is-locked .pay-promo-lock b { color: #ffb0b0; }
[data-pay-promo].is-locked .pay-promo-lock small { color: rgba(255, 200, 200, 0.78); }

/* ---------- ЛК на телефоне: читаемые подписи и удобные нажатия ---------- */
@media (max-width: 560px) {
  /* Ничего мельче 11 px: подписи над цифрами и статусы. */
  #pane-home dt,
  .hm-live,
  .hm-kicker,
  .pf-role,
  .hm-stat-kicker,
  .gpt-kicker,
  .hp-kicker,
  #pane-profile small { font-size: 11px !important; }
  #pane-home dt { letter-spacing: 0.08em; }
  /* Мелкие ссылки и кнопки — зона нажатия не меньше 40 px. */
  .hm-head-link {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 6px;
    margin: -10px -6px;
  }
  .cab-pill { min-height: 38px; }
  .cab-id { min-height: 32px; display: inline-flex; align-items: center; }
  /* Длинный ник поддержки переносится, а не обрезается. */
  #pane-help b { white-space: normal !important; overflow-wrap: anywhere; text-overflow: clip !important; }
}
@media (max-width: 360px) {
  .sp-sub-copy { padding: 0 8px !important; font-size: 12px !important; }
  .hm-hero-top { flex-wrap: wrap; row-gap: 6px; }
}

/* Карточки за краем экрана не крутят свои анимации — меньше нагрев. Метку ставит lk.js. */
[data-k-off], [data-k-off] *, [data-k-off] *::before, [data-k-off] *::after { animation-play-state: paused !important; }

/* ---------- Окна поверх страницы (пополнение, вход): одна прокрутка и верх не под статус-баром ---------- */
/* Страница под открытым окном стоит — иначе в Safari крутятся и окно, и страница (два скролла). */
html:has(.pay-sheet:not([hidden])),
html:has(.pay-sheet:not([hidden])) body,
html:has(.layer:not([hidden])),
html:has(.layer:not([hidden])) body { overflow: hidden !important; overscroll-behavior: none; }
/* Высота по видимой части экрана (dvh): в Safari vh больше видимой области, и верх окна уезжал под статус-бар. */
.pay-card,
.is-mobile .layer-card {
  max-height: calc(100vh - env(safe-area-inset-top, 0px) - 16px);
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - 16px);
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
html.is-app .pay-card,
html.is-app .layer-card {
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - 28px);
}
.pay-sheet { overscroll-behavior: none; }

/* Переключатель устройств в «Помощи»: иконки без серой рамки и подложки — того же цвета, что подпись. */
#pane-help .hp-dev-tabs button > span {
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: inherit !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
}

/* Иконка ChatGPT в карточке на главной — крупнее. */
body.wx-app .cab-ico.gpt-orb { width: 44px !important; height: 44px !important; flex: none; }
body.wx-app .cab-ico.gpt-orb svg { width: 29px !important; height: 29px !important; }

/* ---------- Автопродление: та же фирменная ракета, что у баланса; летит вправо, пламя — когда включено ---------- */
.app .rk-knob svg.rkx {
  width: 25px; height: 25px; overflow: visible;
  transform: rotate(45deg);
  filter: saturate(.55) brightness(.8);
  transition: filter .35s;
}
.app .rk-knob svg.rkx .st-rk-flame { opacity: 0; animation: none; transition: opacity .25s; }
.app .rk-switch.is-on .rk-knob svg.rkx { filter: drop-shadow(0 0 4px rgba(255, 180, 80, .55)); animation: rkxBob .9s ease-in-out infinite alternate; }
.app .rk-switch.is-on .rk-knob svg.rkx .st-rk-flame { opacity: 1; transform-box: fill-box; transform-origin: 50% 0; animation: rkxFire .13s ease-in-out infinite alternate; }
@keyframes rkxFire { from { transform: scaleY(.75); } to { transform: scaleY(1.15); } }
@keyframes rkxBob { from { translate: 0 -.6px; } to { translate: 0 .6px; } }
.app .rk-switch.is-on .rk-track::before { background: linear-gradient(90deg, rgba(255, 170, 70, 0) 0%, rgba(255, 170, 70, .28) 55%, rgba(255, 214, 140, .5) 100%); }
.app .rk-switch.is-on .rk-trail { width: 40px; background: linear-gradient(90deg, rgba(255, 150, 60, 0), rgba(255, 196, 110, .85) 80%, #fff6e0); }
.app .rk-switch.is-on .rk-stars i { background: linear-gradient(90deg, rgba(255, 255, 255, 0), #fff); }
.app .rk-switch.is-on .rk-knob {
  background: radial-gradient(circle at 35% 30%, #34343c 0%, #141418 70%);
  box-shadow: 0 0 0 1px rgba(255, 196, 110, .6), 0 0 10px rgba(255, 170, 70, .45), 0 2px 6px rgba(0, 0, 0, .6);
}
@media (prefers-reduced-motion: reduce) {
  .app .rk-switch.is-on .rk-knob svg.rkx, .app .rk-switch.is-on .rk-knob svg.rkx .st-rk-flame { animation: none; }
}