:root {
  --bg: #030611;
  --surface: #071225;
  --surface2: #0a1930;
  --line: rgba(111, 172, 255, .18);
  --text: #f5f9ff;
  --muted: #8297b5;
  --lime: #56b8ff;
  --lime2: #176dff;
  --cyan: #76e7ff;
  --electric: #2388ff;
  --violet: #6858ff;
  --radius: 24px;
}

html, body { background: var(--bg); }

.scroll-progress {
  position: fixed;
  inset: 0 auto auto 0;
  z-index: 1000;
  width: calc(var(--scroll-progress, 0) * 100%);
  height: 3px;
  pointer-events: none;
  background: linear-gradient(90deg, #2d78ff, #69ddff, #9af6ff);
  box-shadow: 0 0 18px #35b7ff;
}

.aurora-field, .particle-field { position: fixed; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; contain: strict; }
.aurora-field i { position: absolute; width: 58vw; height: 16vw; border-radius: 50%; filter: blur(48px); opacity: .09; animation: aurora-sweep 28s ease-in-out infinite alternate; will-change: transform, opacity; }
.aurora-field i:nth-child(1) { left: -18vw; top: 14vh; background: #1976ff; transform: rotate(-20deg); }
.aurora-field i:nth-child(2) { right: -20vw; top: 46vh; background: #00c8ff; animation-delay: -11s; transform: rotate(22deg); }
@keyframes aurora-sweep { 50% { opacity: .14; transform: translate3d(8vw, -4vh, 0) rotate(6deg) scale(1.08); } 100% { transform: translate3d(-4vw, 6vh, 0) rotate(-6deg) scale(.97); } }

.particle-field i { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: #a9efff; opacity: .18; animation: particle-rise 16s linear infinite; }
.particle-field i:nth-child(1) { left:12%; top:78%; animation-delay:-2s; }
.particle-field i:nth-child(2) { left:38%; top:42%; animation-delay:-7s; }
.particle-field i:nth-child(3) { left:64%; top:68%; animation-delay:-4s; }
.particle-field i:nth-child(4) { left:84%; top:28%; animation-delay:-11s; }
@keyframes particle-rise { 0% { transform: translateY(24px); opacity:0; } 25% { opacity:.28; } 100% { transform: translateY(-120px); opacity:0; } }

body {
  background:
    radial-gradient(ellipse 70% 45% at 70% 6%, rgba(48, 92, 255, .19), transparent 65%),
    radial-gradient(ellipse 55% 38% at 0 55%, rgba(0, 165, 255, .12), transparent 70%),
    linear-gradient(180deg, #030611 0%, #050b19 48%, #030611 100%);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(65, 128, 255, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(65, 128, 255, .035) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, black, transparent 88%);
}

body::after {
  content: "";
  position: fixed;
  left: 0;
  top: 0;
  width: 420px;
  height: 420px;
  z-index: -2;
  pointer-events: none;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(56, 161, 255, .08), transparent 68%);
  transform: translate3d(calc(var(--cursor-x, 50vw) - 210px), calc(var(--cursor-y, 25vh) - 210px), 0);
  will-change: transform;
}

.noise { opacity: .04; }
.glow { animation: glow-drift 18s ease-in-out infinite alternate; contain: strict; }
.glow-a { width: 420px; height: 420px; right: -110px; top: 12%; background: #1f73ff; opacity: .14; }
.glow-b { width: 380px; height: 380px; left: -160px; top: 58%; background: #00b7ff; opacity: .1; animation-delay: -5s; }
@keyframes glow-drift { to { transform: translate3d(24px, 36px, 0) scale(1.08); } }

.site-header {
  width: min(1380px, calc(100% - 40px));
  height: 84px;
  border: 1px solid rgba(110, 170, 255, .13);
  border-top: 0;
  border-radius: 0 0 22px 22px;
  padding: 0 18px;
  background: rgba(3, 8, 20, .82);
  box-shadow: 0 18px 70px rgba(0, 0, 0, .2);
  backdrop-filter: blur(14px) saturate(120%);
}

main { width: min(1380px, calc(100% - 40px)); }
footer { width: min(1380px, calc(100% - 40px)); }

.brand { gap: 13px; }
.brand-mark {
  width: 48px;
  height: 48px;
  border: 1px solid rgba(108, 193, 255, .45);
  border-radius: 15px;
  overflow: hidden;
  background: #061124;
  box-shadow: 0 0 30px rgba(36, 133, 255, .28), inset 0 0 18px rgba(78, 192, 255, .18);
}
.brand-mark picture { display: grid; width: 100%; height: 100%; place-items: center; }
.brand-mark img { width: 100%; height: 100%; object-fit: contain; transform: scale(1.18); }
.brand b {
  font-size: 18px;
  font-weight: 950;
  letter-spacing: .08em;
  background: linear-gradient(100deg, #fff 20%, #8edbff 60%, #4d8cff);
  -webkit-background-clip: text;
  color: transparent;
}
.brand small { color: #6682a6; letter-spacing: .22em; }
.desktop-nav { gap: 28px; }
.desktop-nav a { position: relative; color: #899cb8; font-weight: 700; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -9px; height: 2px; background: #65c9ff; transition: .25s; }
.desktop-nav a:hover { color: white; }
.desktop-nav a:hover::after { right: 0; }
.desktop-nav a.active { color:white; }
.desktop-nav a.active::after { right:0; }
.header-stats { display: flex; align-items: center; gap: 18px; }
.header-stats > span { display: grid; min-width: 112px; }
.header-stats b { color: #eef8ff; font-size: 14px; letter-spacing: -.02em; }
.header-stats small { color: #617b9e; font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
.header-stats > i { width: 1px; height: 27px; background: rgba(108, 164, 232, .18); }
.header-rating b { color: #68d6ff; }
.account-button {
  border-color: rgba(87, 164, 255, .35);
  background: linear-gradient(135deg, rgba(17, 50, 92, .75), rgba(8, 25, 54, .7));
  color: #d9edff;
  box-shadow: inset 0 1px rgba(255,255,255,.06);
}
.account-button:hover { border-color: #57bdff; color: white; box-shadow: 0 0 30px rgba(47, 145, 255, .18); }

.hero { min-height: 720px; padding: 92px 0 82px; gap: 52px; }
.live-pill {
  border-color: rgba(67, 179, 255, .35);
  background: rgba(7, 32, 67, .72);
  color: #b8dcff;
  box-shadow: inset 0 1px rgba(255,255,255,.05), 0 12px 38px rgba(0, 85, 190, .12);
}
.live-pill i { background: #5ff6ba; box-shadow: 0 0 16px #5ff6ba; animation: live-pulse 1.8s ease-in-out infinite; }
@keyframes live-pulse { 50% { opacity: .45; transform: scale(.7); } }
.eyebrow { color: #67c8ff; letter-spacing: .23em; }
.hero h1 {
  font-size: clamp(56px, 6.5vw, 88px);
  line-height: .94;
  letter-spacing: -.072em;
  text-shadow: 0 12px 50px rgba(0, 0, 0, .45);
}
.hero h1 em {
  color: transparent;
  background: linear-gradient(100deg, #54b8ff 5%, #8beaff 45%, #557cff 95%);
  -webkit-background-clip: text;
  filter: drop-shadow(0 0 28px rgba(55, 148, 255, .25));
  background-size: 220% auto;
  animation: headline-flow 4.5s ease-in-out infinite alternate;
}
@keyframes headline-flow { to { background-position: 100% center; filter: drop-shadow(0 0 42px rgba(55, 180, 255, .42)); } }
.hero-text { color: #92a7c4; font-size: 18px; line-height: 1.7; }
.primary-action, .modal-action {
  gap: 22px;
  border: 1px solid rgba(133, 211, 255, .38);
  background: linear-gradient(135deg, #58c8ff 0%, #287dff 52%, #4c55ef 100%);
  color: #020817;
  box-shadow: 0 16px 45px rgba(33, 120, 255, .3), inset 0 1px rgba(255,255,255,.5);
  transition: transform .2s, box-shadow .2s, filter .2s;
}
.primary-action:hover, .modal-action:hover { transform: translateY(-2px); filter: brightness(1.1); box-shadow: 0 22px 58px rgba(33, 120, 255, .38); }
.primary-action b { font-size: 19px; }
.secondary-action {
  border-color: rgba(91, 160, 242, .3);
  background: rgba(8, 21, 43, .78);
  color: #d9eaff;
  box-shadow: inset 0 1px rgba(255,255,255,.05);
}
.secondary-action:hover { border-color: #54b9ff; background: rgba(15, 43, 82, .82); }
.hero-proof { color: #6f83a0; }
.hero-proof b { color: #8bdcff; }

.hero-visual { min-height: 530px; display: grid; place-items: center; isolation: isolate; }
.hero-visual::before {
  content: "";
  position: absolute;
  width: 88%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(54, 151, 255, .27), rgba(23, 75, 194, .06) 44%, transparent 69%);
  filter: blur(5px);
  animation: core-breathe 5s ease-in-out infinite;
}
.hero-visual::after { content: ""; position: absolute; inset: 18%; z-index: -2; background: #2188ff; opacity: .2; filter: blur(56px); }
@keyframes core-breathe { 50% { transform: scale(1.08); opacity: .72; } }
.logo-stage {
  position: relative;
  width: min(470px, 88%);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  z-index: 2;
  animation: logo-float 5.8s ease-in-out infinite;
}
.energy-ring { position:absolute; z-index:1; width:70%; aspect-ratio:1; border:1px solid rgba(94,204,255,.32); border-radius:50%; box-shadow:0 0 55px rgba(49,140,255,.18), inset 0 0 35px rgba(66,173,255,.12); animation:energy-pulse 3.2s ease-in-out infinite; }
@keyframes energy-pulse { 50% { width:83%; opacity:.35; filter:blur(1px); } }
.logo-stage picture { display:block; width:100%; height:100%; }
.logo-stage img { transform:translate3d(calc(var(--parallax-x, 0px) * .25), calc(var(--parallax-y, 0px) * .25), 0); transition:transform .18s ease-out; }
.sale-signal { position:absolute; z-index:4; display:flex; align-items:center; gap:9px; min-width:135px; padding:9px 11px; border:1px solid rgba(92,183,255,.25); border-radius:13px; background:rgba(4,16,36,.72); box-shadow:0 15px 45px rgba(0,18,58,.42), inset 0 1px rgba(255,255,255,.06); backdrop-filter:blur(15px); opacity:0; animation:sale-fly 9s ease-in-out infinite; }
.sale-signal > i { display:grid; place-items:center; width:27px; height:27px; border-radius:9px; background:linear-gradient(145deg,#64deff,#3474ff); color:#031024; font-style:normal; font-weight:950; }
.sale-signal small,.sale-signal b { display:block; white-space:nowrap; }.sale-signal small { color:#6f89aa; font-size:8px; }.sale-signal b { color:#eaf7ff; font-size:10px; }
.sale-one { top:16%; left:-2%; }.sale-two { right:-1%; bottom:21%; animation-delay:-3s; }.sale-three { left:9%; bottom:5%; animation-delay:-6s; }
@keyframes sale-fly { 0%,18% { opacity:0; transform:translateY(18px) scale(.92); } 28%,64% { opacity:1; transform:translateY(0) scale(1); } 76%,100% { opacity:0; transform:translateY(-22px) scale(.96); } }
.logo-stage img {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 35px 45px rgba(0, 35, 105, .6)) drop-shadow(0 0 24px rgba(68, 182, 255, .35));
}
.logo-halo { position: absolute; inset: 18%; border-radius: 50%; background: #1c8cff; filter: blur(48px); opacity: .18; }
@keyframes logo-float { 50% { transform: translateY(-12px) rotate(.7deg); } }
.orbit { position: absolute; z-index: 1; border: 1px solid rgba(76, 177, 255, .28); border-radius: 50%; transform: rotate(-18deg); }
.orbit::after { content: ""; position: absolute; width: 9px; height: 9px; top: 12%; left: 17%; border-radius: 50%; background: #9feaff; box-shadow: 0 0 20px #56c8ff; }
.orbit-one { width: 100%; height: 58%; animation: orbit-spin 16s linear infinite; }
.orbit-two { width: 77%; height: 100%; transform: rotate(36deg); animation: orbit-spin-reverse 22s linear infinite; }
@keyframes orbit-spin { to { transform: rotate(342deg); } }
@keyframes orbit-spin-reverse { to { transform: rotate(-324deg); } }
.floating-card {
  z-index: 4;
  border-color: rgba(98, 166, 255, .28);
  background: linear-gradient(145deg, rgba(13, 35, 68, .88), rgba(5, 15, 33, .88));
  box-shadow: 0 24px 60px rgba(0,0,0,.55), inset 0 1px rgba(255,255,255,.07);
}
.order-card { left: -6px; bottom: 44px; animation: card-hover 4.8s ease-in-out infinite; }
.order-card > i { background: linear-gradient(145deg,#7aeeff,#3a8dff); color:#031023; box-shadow: 0 0 25px rgba(77, 180, 255, .35); }
.uptime-card { right: -8px; top: 72px; width: 218px; animation: card-hover 4.8s ease-in-out -2.4s infinite; }
.uptime-card strong { color: #70d9ff; }
@keyframes card-hover { 50% { transform: translateY(-9px); } }

.metrics {
  border-color: rgba(88, 149, 224, .2);
  background: linear-gradient(130deg, rgba(9, 24, 48, .88), rgba(5, 13, 29, .88));
  box-shadow: 0 24px 70px rgba(0,0,0,.25), inset 0 1px rgba(255,255,255,.04);
}
.metrics div { border-color: rgba(88, 149, 224, .16); }
.metrics strong { color: #dff3ff; }

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .55s ease, transform .65s cubic-bezier(.16,1,.3,1); }
.reveal.revealed { opacity: 1; transform: none; }
.catalog-section, .store-showcase, .dash-view { content-visibility: auto; contain-intrinsic-size: 1px 800px; }

.signal-marquee {
  width: 100vw;
  margin: 46px calc(50% - 50vw) 0;
  overflow: hidden;
  border-top: 1px solid rgba(85, 158, 244, .16);
  border-bottom: 1px solid rgba(85, 158, 244, .16);
  background: rgba(4, 13, 29, .66);
  transform: rotate(-1deg);
}
.signal-marquee > div { display: flex; align-items: center; gap: 34px; width: max-content; padding: 17px 0; animation: marquee-flow 24s linear infinite; }
.signal-marquee span { color: #8098b8; font-size: 11px; font-weight: 850; letter-spacing: .18em; }
.signal-marquee i { color: #5bcbff; font-style: normal; text-shadow: 0 0 18px #3399ff; }
@keyframes marquee-flow { to { transform: translateX(-50%); } }

.section-heading h2, .feature-band h2, .faq-section h2 { color: #f5f9ff; }
.steps article, .plugin-card, .profile-card, .profile-section {
  border-color: rgba(92, 153, 228, .19);
  background: linear-gradient(145deg, rgba(12, 29, 56, .92), rgba(4, 12, 27, .94));
  box-shadow: inset 0 1px rgba(255,255,255,.04);
}
.plugin-card {
  position: relative;
  overflow: hidden;
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.plugin-card:hover {
  transform: translateY(-6px);
  border-color: rgba(105, 190, 255, .42);
  box-shadow: 0 28px 70px rgba(10, 50, 120, .28), inset 0 1px rgba(255,255,255,.06);
}
.plugin-card .plugin-open,
.plugin-card .buy,
.modal-action {
  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
.plugin-card .plugin-open:hover,
.plugin-card .buy:hover,
.modal-action:hover { filter: brightness(1.08); transform: translateY(-1px); }
.steps article::after, .plugin-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: radial-gradient(420px circle at var(--mx, 80%) var(--my, 0%), rgba(64, 162, 255, .13), transparent 42%);
}
.step-icon { border-color: rgba(75, 171, 255, .38); background: rgba(17, 66, 116, .55); color: #6bd7ff; }

.catalog-section { position: relative; }
.plugin-card { position: relative; min-height: 390px; overflow: hidden; transform-style: preserve-3d; transition: transform .28s cubic-bezier(.16,1,.3,1), border-color .3s, box-shadow .3s; }
.plugin-card.is-tilting { will-change: transform; }
.plugin-card:hover { transform: perspective(950px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-5px); border-color: rgba(85, 177, 255, .58); box-shadow: 0 24px 70px rgba(0, 37, 95, .42), inset 0 1px rgba(255,255,255,.06); }
.plugin-card > * { position: relative; z-index: 2; transform: translateZ(12px); }
.plugin-card::before { content:""; position:absolute; inset:-45% -120%; z-index:1; pointer-events:none; background:linear-gradient(105deg, transparent 42%, rgba(127,220,255,.13) 49%, rgba(255,255,255,.22) 50%, transparent 57%); transform:translateX(-35%) rotate(8deg); transition:transform .8s ease; }
.plugin-card:hover::before { transform:translateX(35%) rotate(8deg); }
.plugin-price strong { color:#f2fbff; text-shadow:0 0 20px rgba(79,191,255,.22); }
.plugin-card:hover .plugin-price strong { color:#7ee4ff; text-shadow:0 0 24px rgba(57,174,255,.4); transition:color .35s ease, text-shadow .35s ease; }
.plugin-open { position:relative; overflow:hidden; transition:transform .22s ease, border-color .2s, box-shadow .2s; }
.plugin-open:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(34,132,255,.25); }
.plugin-open::after { content:""; position:absolute; inset:0; background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.18),transparent 80%); transform:translateX(-120%); transition:transform .55s ease; }
.plugin-card:hover .plugin-open::after { transform:translateX(120%); }
.click-ripple { position:absolute!important; z-index:20!important; width:10px; height:10px; margin:-5px; border-radius:50%; pointer-events:none; background:rgba(193,242,255,.72); animation:ripple-out .65s ease-out forwards; }
@keyframes ripple-out { to { opacity:0; transform:scale(18); } }
button,.primary-action,.creator-actions a { position:relative; overflow:hidden; }
.plugin-card:nth-child(3n+2) { background: linear-gradient(145deg, rgba(12, 35, 66, .94), rgba(7, 12, 31, .96)); }
.plugin-icon {
  border-color: rgba(111, 199, 255, .4);
  background: linear-gradient(145deg, #5fd6ff, #3775ee);
  color: #031022;
  box-shadow: 0 13px 36px rgba(35, 126, 255, .27);
  overflow: hidden;
}
.plugin-icon img { width: 100%; height: 100%; object-fit: cover; }
.plugin-version { border-color: rgba(97, 151, 218, .24); background: rgba(5, 15, 32, .55); }
.plugin-tag { color: #71d9ff; border-color: rgba(68, 162, 238, .38); background: rgba(11, 52, 94, .55); text-transform: uppercase; }
.owned-label { color: #70dcff; }
.plugin-open { border-color: rgba(91, 169, 255, .34); background: linear-gradient(135deg, rgba(18, 54, 94, .95), rgba(18, 36, 76, .95)); }
.plugin-open:hover { border-color: #63c9ff; color: white; }
.loader-install{background:radial-gradient(circle at 100% 0,rgba(42,142,255,.2),transparent 42%),linear-gradient(145deg,#0b1c36,#07101f)!important}.loader-install>p{max-width:760px;color:#8299b6}.loader-download{display:inline-flex;align-items:center;min-height:43px;padding:0 15px;border:1px solid rgba(91,181,255,.38);border-radius:12px;background:linear-gradient(135deg,#56d4ff,#3678ff);color:#031024!important;font-weight:950}.install-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}.install-steps>div{display:flex;gap:12px;min-height:130px;padding:17px;border:1px solid rgba(86,157,239,.2);border-radius:15px;background:rgba(3,13,29,.52)}.install-steps>div>b{color:#62d6ff;font-size:11px}.install-steps span,.install-steps strong,.install-steps small{display:block}.install-steps strong{margin-bottom:7px}.install-steps small{color:#7089a8;line-height:1.5;overflow-wrap:anywhere}
.funpay-live-section{padding:120px 0 130px}.funpay-live-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:18px}.live-console,.event-rail{border:1px solid rgba(81,157,242,.22);border-radius:25px;background:radial-gradient(circle at 90% 0,rgba(36,126,255,.17),transparent 40%),rgba(4,13,28,.83)}.live-console{position:relative;min-height:480px;padding:25px;overflow:hidden}.live-console:before{content:"";position:absolute;inset:-60% 40% -60% -20%;background:linear-gradient(90deg,transparent,rgba(69,178,255,.08),transparent);transform:rotate(20deg);animation:console-scan 5s linear infinite}@keyframes console-scan{to{transform:translateX(180%) rotate(20deg)}}.live-console-head{position:relative;display:flex;align-items:center;justify-content:space-between;padding-bottom:19px;border-bottom:1px solid rgba(82,150,229,.18)}.live-console-head span{display:flex;align-items:center;gap:9px;font-weight:900}.live-console-head i{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:#3286ff;font-style:normal}.live-console-head>b{color:#58e9ae;font-size:9px;letter-spacing:.14em}.live-order,.live-result{position:relative;display:flex;align-items:center;gap:14px;margin-top:30px;padding:18px;border:1px solid rgba(86,157,237,.2);border-radius:17px;background:rgba(7,26,52,.72)}.live-order em{color:#63d4ff;font-size:10px;font-style:normal}.live-order span,.live-order small,.live-order strong,.live-result span,.live-result small,.live-result strong{display:block}.live-order small,.live-result small{color:#7089a8;font-size:9px}.live-order>b{margin-left:auto;color:#5ee5af;font-size:9px}.live-path{position:relative;height:120px;margin:0 34px;border-left:1px solid #3d8eff}.live-path:after{content:"";position:absolute;left:-4px;top:0;width:7px;height:7px;border-radius:50%;background:#83e7ff;box-shadow:0 0 18px #54caff;animation:path-drop 2.2s linear infinite}@keyframes path-drop{to{transform:translateY(120px);opacity:0}}.live-path i{position:absolute;left:-3px;width:5px;height:5px;border-radius:50%;background:#377aff}.live-path i:nth-child(1){top:18%}.live-path i:nth-child(2){top:42%}.live-path i:nth-child(3){top:66%}.live-path i:nth-child(4){top:88%}.live-result>b{display:grid;place-items:center;width:39px;height:39px;border-radius:12px;background:linear-gradient(145deg,#66e0ff,#3b73ff);color:#031024}.live-result time{margin-left:auto;color:#61d6ff;font-size:10px}.event-rail{display:grid;gap:1px;padding:10px}.event-rail article{display:grid;grid-template-columns:42px 1fr;gap:15px;min-height:150px;padding:22px;border-radius:18px;transition:.25s}.event-rail article:hover{background:rgba(19,52,91,.58);transform:translateX(7px)}.event-rail article>i{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(84,177,255,.3);border-radius:12px;color:#65d5ff;font-style:normal;font-weight:900}.event-rail small{color:#5085bf;font-size:8px;font-weight:950;letter-spacing:.15em}.event-rail h3{margin:8px 0 5px;font-size:21px}.event-rail p{margin:0;color:#7890ae}
@media(max-width:900px){.funpay-live-grid{grid-template-columns:1fr}.install-steps{grid-template-columns:1fr}.install-steps>div{min-height:auto}}
@media(prefers-reduced-motion:reduce){.live-console:before,.live-path:after{animation:none!important}}
.loading i { border-color: rgba(89, 139, 202, .3); border-top-color: #62cfff; }

.feature-band {
  position: relative;
  overflow: hidden;
  border-color: rgba(90, 158, 239, .24);
  background: radial-gradient(circle at 90% 10%, rgba(30, 124, 255, .22), transparent 42%), linear-gradient(135deg,#08182d,#050b18);
  box-shadow: 0 30px 100px rgba(0,0,0,.32);
}
.feature-band::before { content:""; position:absolute; width:300px; height:300px; left:-130px; bottom:-200px; border:1px solid rgba(79,163,255,.25); border-radius:50%; box-shadow:0 0 70px rgba(35,125,255,.18); }
.terminal { border-color: rgba(82, 157, 240, .3); background: rgba(2, 8, 19, .9); box-shadow: 0 28px 85px rgba(0,0,0,.55), 0 0 60px rgba(23,90,220,.12); }
.terminal-body p span, .terminal-body strong { color: #65d4ff; }

.creator-section {
  position: relative;
  min-height: 720px;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 90px;
  align-items: center;
  margin-top: 120px;
  padding: 90px 76px;
  overflow: hidden;
  border: 1px solid rgba(91, 166, 255, .22);
  border-radius: 38px;
  background: radial-gradient(circle at 8% 15%, rgba(61, 155, 255, .2), transparent 35%), radial-gradient(circle at 90% 80%, rgba(60, 74, 255, .17), transparent 37%), linear-gradient(145deg, rgba(8, 26, 51, .96), rgba(2, 7, 17, .98));
  box-shadow: 0 35px 120px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.05);
}
.creator-section::before { content:"UMKH"; position:absolute; left:-24px; bottom:-100px; color:rgba(100,190,255,.035); font-size:clamp(180px,26vw,390px); font-weight:950; line-height:1; letter-spacing:-.1em; pointer-events:none; }
.creator-copy, .creator-stack { position: relative; z-index: 2; }
.creator-copy h2 { margin: 12px 0 -2px; color:#f4f8ff; font-size:clamp(80px,11vw,150px); line-height:.82; letter-spacing:-.085em; }
.creator-copy h2 span { color:#5dcfff; text-shadow:0 0 35px rgba(64,176,255,.45); }
.creator-copy h3 { margin:30px 0 22px; color:#dcecff; font-size:clamp(29px,3.7vw,50px); line-height:1.02; letter-spacing:-.055em; }
.creator-copy > p:not(.eyebrow) { max-width:660px; color:#8198b7; font-size:15px; line-height:1.75; }
.creator-actions { display:flex; align-items:center; gap:20px; margin-top:32px; }
.creator-actions a { display:inline-flex; gap:24px; align-items:center; padding:14px 18px; border:1px solid rgba(104,195,255,.4); border-radius:14px; background:linear-gradient(135deg,#5bd7ff,#3b72ff); color:#031024; text-decoration:none; font-weight:900; box-shadow:0 18px 50px rgba(35,125,255,.25); transition:.25s; }
.creator-actions a:hover { transform:translateY(-4px); box-shadow:0 25px 65px rgba(35,125,255,.38); }
.creator-actions > span { color:#6683a6; }
.creator-stack { display:grid; gap:12px; }
.creator-stack article { position:relative; min-height:142px; padding:24px 24px 22px 82px; overflow:hidden; border:1px solid rgba(91,155,232,.18); border-radius:22px; background:rgba(5,17,36,.68); transition:.3s; }
.creator-stack article:hover { transform:translateX(-8px); border-color:rgba(84,194,255,.45); background:rgba(9,31,61,.82); }
.creator-stack article > span { position:absolute; left:22px; top:22px; color:#52c6ff; font-size:11px; font-weight:900; }
.creator-stack h4 { margin:0 0 7px; color:#edf7ff; font-size:21px; }
.creator-stack p { margin:0; color:#738aa8; font-size:12px; }
.creator-stars i { position:absolute; width:4px; height:4px; border-radius:50%; background:#a7e9ff; box-shadow:0 0 18px #62cfff; animation:star-drift 5s ease-in-out infinite; }
.creator-stars i:nth-child(1){left:8%;top:14%}.creator-stars i:nth-child(2){left:43%;top:8%;animation-delay:-1s}.creator-stars i:nth-child(3){left:70%;top:19%;animation-delay:-2.3s}.creator-stars i:nth-child(4){left:25%;top:78%;animation-delay:-3.1s}.creator-stars i:nth-child(5){left:82%;top:65%;animation-delay:-1.7s}.creator-stars i:nth-child(6){left:55%;top:88%;animation-delay:-4s}
@keyframes star-drift { 50% { transform:translateY(-18px) scale(1.8); opacity:.35; } }

details { border-color: rgba(91, 148, 216, .18); }
summary b { color: #5ecbff; }
footer { border-color: rgba(91, 148, 216, .17); }

.modal {
  backdrop-filter: blur(12px);
  background: rgba(1,5,14,.72);
  opacity: 0;
  transition: opacity .18s ease;
}
.modal.is-open { opacity: 1; }
.modal-sheet {
  border-color: rgba(91, 170, 255, .3);
  background: radial-gradient(circle at 90% 0, rgba(37,116,255,.18), transparent 40%), #081326;
  box-shadow: 0 35px 110px rgba(0,0,0,.75);
  transform: translateY(12px) scale(.985);
  transition: transform .22s cubic-bezier(.16,1,.3,1);
}
.modal.is-open .modal-sheet { transform: none; }
.success-orb { width: 66px; height: 66px; display:grid; place-items:center; margin-bottom:20px; border-radius:50%; background:linear-gradient(145deg,#7aeaff,#2e7fff); color:#021022; font-size:30px; font-weight:950; box-shadow:0 0 50px rgba(53,151,255,.38); animation: success-pop .45s cubic-bezier(.2,1.6,.4,1); }
@keyframes success-pop { from { transform:scale(.35); opacity:0; } }
.toast { border-color: rgba(89, 172, 255, .35); background: rgba(7, 26, 52, .94); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

@media (max-width: 980px) {
  .header-stats { display:none; }
  .creator-section { grid-template-columns:1fr; min-height:auto; padding:65px 45px; gap:55px; }
  .hero-visual { min-height: 480px; width: min(650px, 100%); }
  .logo-stage { width: min(440px, 80vw); }
  .order-card { left: 6%; }
  .uptime-card { right: 5%; }
}

@media (max-width: 720px) {
  .site-header { width: calc(100% - 20px); height: 70px; padding: 0 11px; }
  .brand b { font-size: 15px; }
  .brand small { font-size: 8px; }
  .brand-mark { width: 41px; height: 41px; }
  .hero { padding-top: 52px; }
  .hero h1 { font-size: clamp(45px, 14vw, 61px); }
  .hero-visual { min-height: 390px; }
  .logo-stage { width: min(370px, 92vw); }
  .orbit-one { width: 108%; }
  .uptime-card { top: 38px; right: -4px; }
  .order-card { left: -5px; bottom: 28px; }
  .header-stats { display:none; }
  .signal-marquee { margin-top:28px; }
  .creator-section { margin-top:80px; padding:45px 20px; border-radius:28px; }
  .creator-copy h2 { font-size:clamp(72px,25vw,105px); }
  .creator-actions { align-items:flex-start; flex-direction:column; }
  .creator-stack article { padding-left:66px; }
  .sale-signal { transform:scale(.82); }
  .sale-one { left:-4%; }.sale-two { right:-5%; }
}

.mini-hero { display: none; }
body.telegram-miniapp .hero,
body.telegram-miniapp .metrics,
body.telegram-miniapp #how,
body.telegram-miniapp .feature-band,
body.telegram-miniapp .creator-section,
body.telegram-miniapp .signal-marquee,
body.telegram-miniapp #faq,
body.telegram-miniapp footer { display: none; }
body.telegram-miniapp main { width: 100%; padding: 0 13px 36px; }
body.telegram-miniapp .mini-hero {
  display: block;
  position: relative;
  margin: 12px 0 16px;
  padding: 16px;
  overflow: hidden;
  border: 1px solid rgba(91, 176, 255, .28);
  border-radius: 26px;
  background: radial-gradient(circle at 82% 10%, rgba(45, 155, 255, .32), transparent 36%), linear-gradient(145deg, #0b2343, #050b19 68%);
  box-shadow: 0 22px 65px rgba(0, 20, 62, .48), inset 0 1px rgba(255,255,255,.08);
}
body.telegram-miniapp .mini-hero::after { content:""; position:absolute; width:190px; height:190px; right:-75px; bottom:-100px; border:1px solid rgba(92,204,255,.25); border-radius:50%; box-shadow:0 0 55px rgba(39,145,255,.22); }
body.telegram-miniapp .mini-hero-top { position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:10px; }
body.telegram-miniapp .mini-brand { display:flex; align-items:center; gap:9px; }
body.telegram-miniapp .mini-brand img { width:42px; height:42px; border-radius:13px; object-fit:cover; box-shadow:0 0 28px rgba(71,180,255,.35); }
body.telegram-miniapp .mini-brand span, body.telegram-miniapp .mini-profile > span:nth-child(2) { display:flex; flex-direction:column; }
body.telegram-miniapp .mini-brand small { color:#65cfff; font-size:8px; letter-spacing:.14em; }
body.telegram-miniapp .mini-brand b { color:#f2f8ff; font-size:14px; }
body.telegram-miniapp .mini-profile { display:flex; align-items:center; gap:7px; max-width:55%; padding:5px 7px; border:1px solid rgba(112,183,255,.22); border-radius:16px; color:white; background:rgba(5,18,38,.58); text-align:left; }
body.telegram-miniapp .mini-profile > span:first-child { flex:0 0 31px; width:31px; height:31px; display:grid; place-items:center; border-radius:10px; background:linear-gradient(145deg,#68e0ff,#3478ff); background-size:cover; background-position:center; color:#031126; font-weight:900; }
body.telegram-miniapp .mini-profile b, body.telegram-miniapp .mini-profile small { max-width:96px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
body.telegram-miniapp .mini-profile b { font-size:10px; } body.telegram-miniapp .mini-profile small { color:#7791b3; font-size:8px; } body.telegram-miniapp .mini-profile i { color:#6ed7ff; font-size:19px; }
body.telegram-miniapp .mini-welcome { position:relative; z-index:2; margin:34px 0 26px; }
body.telegram-miniapp .mini-welcome p { margin:0 0 8px; color:#61d1ff; font-size:9px; font-weight:850; letter-spacing:.18em; }
body.telegram-miniapp .mini-welcome h1 { margin:0 0 10px; color:#f4f9ff; font-size:clamp(34px,10vw,47px); line-height:.98; letter-spacing:-.055em; }
body.telegram-miniapp .mini-welcome h1 em { color:#64d8ff; font-style:normal; text-shadow:0 0 30px rgba(70,185,255,.3); }
body.telegram-miniapp .mini-welcome > span { display:block; max-width:330px; color:#8aa0bc; font-size:11px; line-height:1.55; }
body.telegram-miniapp .mini-stats { position:relative; z-index:2; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
body.telegram-miniapp .mini-stats div { padding:10px 8px; border:1px solid rgba(90,161,239,.18); border-radius:14px; background:rgba(4,14,31,.58); }
body.telegram-miniapp .mini-stats strong, body.telegram-miniapp .mini-stats span { display:block; } body.telegram-miniapp .mini-stats strong { color:#dff7ff; font-size:17px; } body.telegram-miniapp .mini-stats span { margin-top:2px; color:#69809e; font-size:8px; }
body.telegram-miniapp #catalog { padding-top: 12px; }
body.telegram-miniapp .section-heading { margin-bottom: 18px; }
body.telegram-miniapp .section-heading h2 { font-size: 28px; }
body.telegram-miniapp .section-heading > p { display:none; }
body.telegram-miniapp .catalog-grid { grid-template-columns: 1fr; }
body.telegram-miniapp .plugin-card { min-height: 295px; padding:18px; border-radius:23px; }
body.telegram-miniapp .plugin-card h3 { font-size:24px; }
@media (pointer: coarse), (prefers-reduced-motion: reduce) {
  .plugin-card:hover { transform: translateY(-3px); }
  .aurora-field, .particle-field, body::after { display: none; }
  .glow { animation: none; }
  .modal, .modal-sheet { transition: none; }
}
html.tab-hidden .aurora-field i,
html.tab-hidden .particle-field i,
html.tab-hidden .glow { animation-play-state: paused; }
body.telegram-miniapp .plugin-description { font-size:12px; line-height:1.5; }
body.telegram-miniapp .plugin-icon { width:54px; height:54px; border-radius:16px; }

/* Установки Cardinal в личном кабинете */
.installations-summary {
  padding: 7px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.installations { display: grid; gap: 10px; margin-top: 18px; }
.installation {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 16px;
  transition: border-color .2s ease, background .2s ease;
}
.installation:hover { border-color: rgba(111, 172, 255, .34); }
.installation-main { display: grid; gap: 4px; min-width: 0; }
.installation-main b { font-size: 14px; }
.installation-main small { color: var(--muted); font-size: 12px; }
.installation-state {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}
.installation-state::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--muted);
}
.installation-online { border-color: rgba(35, 136, 255, .38); }
.installation-online .installation-state { color: var(--cyan); }
.installation-online .installation-state::before {
  background: var(--cyan);
  box-shadow: 0 0 10px var(--cyan);
}
.installation-revoked { opacity: .55; }
.installation-revoke {
  padding: 9px 15px;
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  cursor: pointer;
  transition: color .2s ease, border-color .2s ease;
}
.installation-revoke:hover:not(:disabled) { color: #ff8a90; border-color: rgba(255, 138, 144, .5); }
.installation-revoke:disabled { opacity: .5; cursor: default; }

@media (max-width: 720px) {
  .installation { grid-template-columns: 1fr auto; }
  .installation-revoke { grid-column: 1 / -1; width: 100%; }
}

/* Реферальная программа */
.referral-balance {
  padding: 8px 16px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(35, 136, 255, .22), rgba(104, 88, 255, .22));
  border: 1px solid rgba(111, 172, 255, .34);
  color: var(--text);
  font-size: 16px;
  font-weight: 600;
  white-space: nowrap;
}
.referral-link-row { display: flex; gap: 10px; margin-top: 18px; }
.referral-link {
  flex: 1;
  min-width: 0;
  padding: 13px 16px;
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--text);
  font: inherit;
  font-size: 13px;
}
.referral-link:focus { outline: none; border-color: var(--electric); }
.referral-copy {
  padding: 13px 22px;
  background: var(--electric);
  border: 0;
  border-radius: 14px;
  color: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: filter .2s ease;
}
.referral-copy:hover { filter: brightness(1.12); }
.referral-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 16px;
}
.referral-stats div {
  padding: 16px;
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 16px;
  text-align: center;
}
.referral-stats b { display: block; font-size: 22px; color: var(--lime); }
.referral-stats span { color: var(--muted); font-size: 12px; }
.referral-history { display: grid; gap: 8px; margin-top: 18px; }
.balance-entry {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 16px;
  background: var(--surface2);
  border: 1px solid var(--line);
  border-radius: 14px;
}
.balance-entry b { font-size: 13px; }
.balance-entry small { display: block; color: var(--muted); font-size: 11px; margin-top: 3px; }
.balance-amount { font-size: 14px; font-weight: 600; white-space: nowrap; }
.balance-plus { color: var(--lime); }
.balance-minus { color: var(--muted); }

@media (max-width: 720px) {
  .referral-link-row { flex-direction: column; }
  .referral-copy { width: 100%; }
  .referral-stats { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Единая геометрия кнопок: цвета у каждой свои, форма и отклик — общие.
   ========================================================================== */
.primary-action, .modal-action, .account-button, .back-button,
.logout-button, .referral-copy, .installation-revoke {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 0 22px; border-radius: 14px;
  font-size: 13px; font-weight: 900; line-height: 1; white-space: nowrap; cursor: pointer;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, filter .22s ease;
}
.back-button, .logout-button, .referral-copy, .installation-revoke {
  min-height: 42px; padding: 0 16px; font-size: 12px;
}
.primary-action b, .modal-action b { font-size: 12px; transition: transform .22s ease; }
.primary-action:hover b, .modal-action:hover b { transform: translate(2px, -2px); }
.primary-action:active, .modal-action:active, .account-button:active, .back-button:active,
.logout-button:active, .referral-copy:active, .installation-revoke:active {
  transform: translateY(1px) scale(.985);
}
.primary-action:focus-visible, .modal-action:focus-visible, .account-button:focus-visible,
.back-button:focus-visible, .logout-button:focus-visible, .referral-copy:focus-visible,
.installation-revoke:focus-visible, .desktop-nav a:focus-visible {
  outline: 2px solid #6ad6ff; outline-offset: 3px;
}

/* ==========================================================================
   Шапка каталога. Навигация всегда остаётся сверху: плавающая панель снизу
   перекрывала карточки и кнопку покупки на невысоких экранах.
   ========================================================================== */
.site-header { gap: clamp(10px, 2vw, 26px); }
.desktop-nav { align-items: center; min-width: 0; }

@media (max-width: 720px) {
  body { padding-bottom: 0; }
  .site-header { width: calc(100% - 20px); height: 66px; padding: 0 11px; }
  .desktop-nav { display: flex; gap: 11px; }
  .desktop-nav a { font-size: 11px; font-weight: 800; }
  /* Подпись «PLUGIN STORE» первой начинает ломать строку — знак остаётся. */
  .brand span:not(.brand-mark) { display: none; }
  .account-button { min-height: 38px; padding: 0 12px; font-size: 10px; }
}

@media (max-width: 430px) {
  .site-header { height: 62px; padding: 0 9px; }
  .brand-mark { width: 34px; height: 34px; border-radius: 11px; }
  .desktop-nav { gap: 9px; }
  .desktop-nav a { font-size: 10px; }
  .account-button { min-height: 34px; padding: 0 10px; font-size: 9px; }
}

@media (max-width: 360px) {
  .desktop-nav { gap: 7px; }
  .desktop-nav a { font-size: 9px; }
  .account-button { padding: 0 9px; }
}

/* Внутри Telegram шапка тоже нужна — иначе из мини-аппа некуда перейти. */
body.telegram-miniapp .site-header { width: calc(100% - 20px); height: 60px; padding: 0 10px; }
body.telegram-miniapp .header-stats { display: none; }
body.telegram-miniapp .desktop-nav { display: flex; gap: 10px; }
body.telegram-miniapp .desktop-nav a { font-size: 10px; font-weight: 800; }
body.telegram-miniapp .brand span:not(.brand-mark) { display: none; }
body.telegram-miniapp .brand-mark { width: 34px; height: 34px; border-radius: 11px; }
body.telegram-miniapp .account-button { min-height: 34px; padding: 0 10px; font-size: 9px; }
/* Логотип уже есть в шапке — в карточке приветствия он лишний. */
body.telegram-miniapp .mini-brand { display: none; }
body.telegram-miniapp .mini-profile { max-width: 100%; width: 100%; }

/* === store showcase (synced from pages.css) === */
/* ==========================================================================
   Showcase bento — анимированные карточки в стиле продающей витрины
   ========================================================================== */
.showcase-bento{
  display:grid;grid-template-columns:1.15fr .85fr;gap:14px;margin:20px 0 40px;
}
.show-card{
  position:relative;overflow:hidden;border:1px solid rgba(91,162,246,.22);
  border-radius:28px;padding:28px;min-height:340px;
  background:radial-gradient(circle at 90% 0,rgba(40,125,255,.16),transparent 42%),linear-gradient(160deg,#08182e,#040a17 70%);
  box-shadow:inset 0 1px rgba(255,255,255,.05);
  display:grid;gap:22px;align-content:start;
}
.show-chat{grid-row:span 2;min-height:720px;grid-template-rows:auto 1fr}
.show-copy h3{margin:0 0 10px;font-size:clamp(24px,2.4vw,32px);letter-spacing:-.04em;line-height:1.05}
.show-copy p:not(.page-kicker){margin:0 0 14px;color:#7f96b4;font-size:14px;line-height:1.65;max-width:420px}
.show-copy a{color:#6ed6ff;text-decoration:none;font-weight:850;font-size:13px}
.show-copy a:hover{color:#fff}

/* FunPay chat */
.fp-chat{
  position:relative;align-self:end;border:1px solid rgba(80,210,140,.28);
  border-radius:22px;background:rgba(6,12,18,.92);
  box-shadow:0 30px 90px rgba(0,0,0,.45),0 0 60px rgba(40,180,110,.12);
  overflow:hidden;isolation:isolate;
}
.fp-chat:before{
  content:"";position:absolute;inset:-30% -20%;z-index:0;
  background:radial-gradient(circle at 30% 40%,rgba(55,200,120,.18),transparent 45%);
  pointer-events:none;
}
.fp-chat-bar{
  position:relative;z-index:1;display:flex;align-items:center;gap:10px;
  padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.06);
}
.fp-chat-bar .dots{display:flex;gap:5px}
.fp-chat-bar .dots i{width:9px;height:9px;border-radius:50%;background:#ff5f57}
.fp-chat-bar .dots i:nth-child(2){background:#febc2e}
.fp-chat-bar .dots i:nth-child(3){background:#28c840}
.fp-chat-bar b{color:#e8f0f7;font-size:12px}
.fp-chat-bar em{margin-left:auto;color:#5ee3a8;font-style:normal;font-size:9px;letter-spacing:.08em;font-weight:900}
.fp-chat-body{position:relative;z-index:1;display:grid;gap:10px;padding:14px;min-height:360px}
.chat-line{opacity:0;transform:translateY(12px)}
.fp-chat.is-playing .chat-line{animation:chat-in .55s ease forwards;animation-delay:calc(var(--d)*1.1s)}
@keyframes chat-in{to{opacity:1;transform:none}}
.chat-line.info{
  display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;
  background:rgba(255,255,255,.04);color:#9aadc4;font-size:12px;
}
.chat-line.info i{
  display:grid;place-items:center;width:18px;height:18px;border-radius:50%;
  background:#3b82f6;color:#fff;font-size:10px;font-style:normal;font-weight:900;
}
.chat-line.info strong{margin-left:auto;color:#f5a623;letter-spacing:1px}
.chat-line.bot,.chat-line.buyer{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.05)}
.chat-line.buyer{margin-left:18%;background:rgba(40,120,255,.12)}
.chat-line.bot>div,.chat-line.buyer>div{display:flex;align-items:center;gap:7px;margin-bottom:5px}
.chat-line b{font-size:12px;color:#d7e7ff}
.chat-line em{
  display:inline-grid;place-items:center;padding:2px 6px;border-radius:6px;
  background:#2f6dff;color:#fff;font-style:normal;font-size:8px;font-weight:950;
}
.chat-line time{margin-left:auto;color:#617891;font-size:10px}
.chat-line p{margin:0;color:#c5d5e8;font-size:13px;line-height:1.45}
.chat-spark{display:none;
  position:absolute;right:8%;top:18%;z-index:2;color:#7ce7ff;font-size:42px;
  text-shadow:0 0 30px #3db8ff;animation:spark-pulse 2.8s ease-in-out infinite;
}
@keyframes spark-pulse{50%{transform:scale(1.15) rotate(8deg);opacity:.7}}

/* Devices */
.device-stage{position:relative;min-height:180px;display:grid;place-items:center}
.desk-frame{
  width:78%;aspect-ratio:16/10;border:1px solid rgba(90,160,240,.25);border-radius:16px;
  background:linear-gradient(160deg,#0b1a30,#06101f);padding:12px;box-shadow:0 20px 50px rgba(0,0,0,.35);
}
.desk-bar{height:4px;width:28%;border-radius:99px;background:linear-gradient(90deg,#5ad4ff,#3a7bff);margin-bottom:12px}
.desk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;height:calc(100% - 16px)}
.desk-grid b{border-radius:10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.04)}
.desk-grid b.on{background:linear-gradient(145deg,rgba(70,180,255,.45),rgba(40,90,255,.35));box-shadow:0 0 24px rgba(60,160,255,.35);animation:tile-glow 2.4s ease-in-out infinite}
.desk-grid b.on:nth-child(5){animation-delay:.4s}
.desk-grid b.on:nth-child(9){animation-delay:.8s}
@keyframes tile-glow{50%{filter:brightness(1.25)}}
.phone-frame{
  position:absolute;right:4%;bottom:0;width:28%;aspect-ratio:9/16;
  border:1px solid rgba(90,160,240,.3);border-radius:14px;padding:10px 8px;
  background:linear-gradient(180deg,#0d213d,#071222);box-shadow:0 18px 40px rgba(0,0,0,.4);
  animation:phone-float 4.5s ease-in-out infinite;
}
@keyframes phone-float{50%{transform:translateY(-8px)}}
.phone-bar{height:3px;width:40%;margin:0 auto 10px;border-radius:99px;background:rgba(255,255,255,.15)}
.phone-bubbles{display:grid;gap:7px}
.phone-bubbles i{display:block;height:14px;border-radius:8px;background:rgba(255,255,255,.08)}
.phone-bubbles i:nth-child(1){width:70%;background:rgba(70,170,255,.35)}
.phone-bubbles i:nth-child(2){width:88%;margin-left:auto}
.phone-bubbles i:nth-child(3){width:55%;background:rgba(70,170,255,.22)}


/* Пульс магазина */
.u7-pulse{min-height:200px;padding-top:4px}
.pulse-head{display:flex;align-items:baseline;gap:10px;margin-bottom:22px}
.pulse-head strong{font-size:34px;letter-spacing:-.04em;background:linear-gradient(100deg,#fff,#7ad8ff);-webkit-background-clip:text;color:transparent}
.pulse-head span{color:#7188a6;font-size:12px}
.pulse-rows{display:grid;gap:12px}
.pulse-rows>div{display:grid;grid-template-columns:88px 1fr 36px;align-items:center;gap:10px}
.pulse-rows span{color:#9bb0c9;font-size:12px;font-weight:750}
.pulse-rows i{display:block;height:10px;width:0;border-radius:99px;background:linear-gradient(90deg,#3a7bff,#6ce7ff);box-shadow:0 0 18px rgba(60,160,255,.28);transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.u7-pulse.is-on .pulse-rows i{width:var(--w)}
.pulse-rows b{color:#dff4ff;font-size:13px;text-align:right}


/* Code terminal */
.code-terminal{
  position:relative;border:1px solid rgba(90,160,240,.22);border-radius:18px;
  background:#050d1a;overflow:hidden;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  box-shadow:0 20px 50px rgba(0,0,0,.35);
}
.code-bar{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.06)}
.code-bar span{width:9px;height:9px;border-radius:50%;background:#ff5f57}
.code-bar span:nth-child(2){background:#febc2e}
.code-bar span:nth-child(3){background:#28c840}
.code-bar b{margin-left:8px;color:#7f96b4;font-size:11px;font-weight:700}
.code-terminal pre{margin:0;padding:14px 16px 22px;overflow:hidden;min-height:160px}
.code-terminal code{display:block;color:#c7d7ec;font-size:12px;line-height:1.65;white-space:pre}
.c-kw{color:#c792ea}.c-fn{color:#82aaff}.c-str{color:#c3e88d}.c-muted{color:#546e7a}
.code-cursor{
  position:absolute;left:16px;bottom:14px;width:8px;height:14px;background:#6ad6ff;
  animation:blink 1s steps(1) infinite;
}
@keyframes blink{50%{opacity:0}}
.code-terminal.is-typing code{animation:code-reveal 4.5s steps(48) infinite}
@keyframes code-reveal{
  0%,8%{clip-path:inset(0 100% 0 0)}
  55%,92%{clip-path:inset(0 0 0 0)}
  100%{clip-path:inset(0 100% 0 0)}
}

.show-wide{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:28px}
@media(max-width:980px){
  .showcase-bento{grid-template-columns:1fr}
  .show-chat{grid-row:auto;min-height:auto}
  .show-wide{grid-template-columns:1fr}
  .fp-chat-body{min-height:300px}
}
@media(max-width:760px){
  .show-card{padding:20px;border-radius:22px;min-height:auto}
  .show-copy h3{font-size:24px}
  .chat-spark{display:none;display:none}
  .chart-head strong{font-size:28px}
  .code-terminal code{font-size:11px}
}

.store-showcase { margin: 48px 0 20px; }
body.telegram-miniapp .store-showcase { display: none; }

/* —— Account dashboard (veemp-like) —— */
.dash-view{padding:8px 0 80px}
.dash{width:100%;max-width:920px;margin:0 auto;display:grid;gap:18px}
.dash-nav{display:flex;justify-content:space-between;align-items:center}
.dash-nav-link{
  border:0;background:transparent;color:#8ea4c2;font:inherit;font-size:14px;font-weight:700;
  cursor:pointer;padding:8px 0;text-decoration:none;
}
.dash-nav-link:hover{color:#eaf3ff}
.dash-hello{
  display:flex;align-items:center;justify-content:space-between;gap:20px;padding:8px 0 4px;
}
.dash-hello-main{display:flex;align-items:center;gap:16px;min-width:0}
.dash-hello h1{
  margin:0;font-size:clamp(28px,5vw,40px);letter-spacing:-.04em;line-height:1.1;font-weight:800;
}
.dash-hello h1 span{font-weight:800}
.dash-avatar{
  width:64px;height:64px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;
  background:linear-gradient(145deg,#3d8bff,#1f4fd4);color:#fff;font-weight:800;font-size:22px;
  background-size:cover;background-position:center;border:2px solid rgba(120,180,255,.35);
  box-shadow:0 12px 36px rgba(30,100,255,.28);
}
.dash-avatar.sm{width:48px;height:48px;font-size:16px;border-width:1px}
.dash-avatar.has-photo{color:transparent}
.dash-id-pill{
  display:inline-flex;align-items:center;gap:10px;margin-top:10px;padding:7px 12px;
  border:1px solid rgba(100,160,230,.22);border-radius:999px;background:rgba(8,20,40,.7);
  color:#9db4d0;font-size:13px;
}
.dash-id-pill code{color:#eaf3ff;font-family:inherit;font-weight:700}
.dash-id-pill button{
  border:0;background:transparent;color:#6ec4ff;font:inherit;font-size:12px;font-weight:800;cursor:pointer;
}
.dash-loader-btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;
  border:0;border-radius:14px;text-decoration:none;white-space:nowrap;
  background:linear-gradient(135deg,#5ec8ff,#3a78ff 55%,#2f5ef0);
  color:#041028!important;font-weight:900;font-size:15px;
  box-shadow:0 12px 40px rgba(50,140,255,.45),0 0 0 1px rgba(140,210,255,.25) inset;
  transition:transform .2s,filter .2s,box-shadow .2s;
}
.dash-loader-btn:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 16px 48px rgba(50,150,255,.55)}
.dash-loader-btn.is-loading{opacity:.7;pointer-events:none}
.dash-panel{
  border:1px solid rgba(100,160,230,.2);border-radius:22px;overflow:hidden;
  background:linear-gradient(160deg,rgba(14,32,60,.92),rgba(6,14,28,.96));
  box-shadow:0 20px 60px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.04);
}
.dash-panel-top{
  display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px;
  border-bottom:1px solid rgba(100,160,230,.14);
}
.dash-user{display:flex;align-items:center;gap:14px;min-width:0}
.dash-user b,.dash-user small,.dash-online{display:block}
.dash-user b{margin-top:2px;font-size:18px;letter-spacing:-.02em}
.dash-user small{margin-top:2px;color:#7f96b4;font-size:13px}
.dash-online{display:inline-flex;align-items:center;gap:6px;color:#4ce0a0;font-size:11px;font-weight:900;letter-spacing:.06em}
.dash-online i{width:7px;height:7px;border-radius:50%;background:#4ce0a0;box-shadow:0 0 12px #4ce0a0}
.dash-soft-btn{
  display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 16px;
  border:1px solid rgba(100,170,255,.28);border-radius:12px;text-decoration:none;
  background:linear-gradient(135deg,#4eb8ff,#3a72f0);color:#041028!important;font-weight:850;font-size:13px;
  box-shadow:0 10px 28px rgba(45,130,255,.28);white-space:nowrap;
}
.dash-metrics{display:grid;grid-template-columns:repeat(4,1fr)}
.dash-metrics>div{
  padding:22px 18px;border-right:1px solid rgba(100,160,230,.12);
}
.dash-metrics>div:last-child{border-right:0}
.dash-metrics strong{display:block;font-size:28px;letter-spacing:-.04em;font-weight:800}
.dash-metrics span{display:block;margin-top:4px;color:#7f96b4;font-size:12px}
.dash-block{
  border:1px solid rgba(100,160,230,.18);border-radius:20px;padding:20px 22px;
  background:linear-gradient(160deg,rgba(12,28,52,.88),rgba(5,12,24,.94));
}
.dash-block h2{margin:0 0 14px;font-size:20px;letter-spacing:-.03em}
.dash-block-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.dash-block-head h2{margin:0}
.dash-row{
  display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 16px;
  border:1px solid rgba(100,160,230,.18);border-radius:16px;text-decoration:none;color:inherit;
  background:rgba(8,22,44,.55);transition:border-color .2s,transform .2s;
}
.dash-row:hover{border-color:rgba(110,190,255,.4);transform:translateY(-1px)}
.dash-row b{display:block;font-size:16px}
.dash-row span{display:block;margin-top:4px;color:#7f96b4;font-size:13px}
.dash-row i{color:#7f96b4;font-style:normal;font-size:22px}
.dash-row.is-loading{opacity:.7;pointer-events:none}
.dash-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.dash-steps>div{
  display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:12px;
  border:1px solid rgba(90,150,220,.14);background:rgba(4,14,30,.45);color:#9db4d0;font-size:13px;
}
.dash-steps b{color:#62d6ff;font-size:11px;letter-spacing:.04em}
.dash-plugins{display:grid;gap:10px}
.dash-plugin{
  display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:14px;padding:14px;
  border:1px solid rgba(100,160,230,.18);border-radius:16px;background:rgba(8,22,44,.5);
}
.dash-plugin .plugin-icon{width:48px;height:48px;border-radius:14px;font-size:18px}
.dash-plugin-copy b{display:block;font-size:16px}
.dash-plugin-copy small{display:block;margin-top:3px;color:#7f96b4}
.dash-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dash-action{
  display:block;padding:22px 20px;border:1px solid rgba(100,160,230,.18);border-radius:18px;
  background:linear-gradient(160deg,rgba(12,28,52,.88),rgba(5,12,24,.94));
  color:inherit;text-decoration:none;text-align:left;font:inherit;cursor:pointer;
  transition:border-color .2s,transform .2s;
}
.dash-action:hover{border-color:rgba(110,190,255,.4);transform:translateY(-2px)}
.dash-action b{display:block;font-size:17px}
.dash-action span{display:block;margin-top:6px;color:#7f96b4;font-size:13px}
.dash-view .referral-link-row{margin-top:12px}
.dash-view .referral-stats{margin-top:14px}
.dash-view .installations{display:grid;gap:8px}
.dash-view .empty-state{padding:18px;border:1px dashed rgba(100,160,230,.2);border-radius:14px;color:#7f96b4}
.dash-view .empty-state b{display:block;color:#eaf3ff;margin-bottom:4px}
@media(max-width:760px){
  .dash-hello{flex-direction:column;align-items:stretch}
  .dash-loader-btn{width:100%}
  .dash-metrics{grid-template-columns:1fr 1fr}
  .dash-metrics>div:nth-child(2){border-right:0}
  .dash-metrics>div:nth-child(-n+2){border-bottom:1px solid rgba(100,160,230,.12)}
  .dash-panel-top{flex-direction:column;align-items:stretch}
  .dash-soft-btn{width:100%}
  .dash-plugin{grid-template-columns:44px 1fr;grid-template-areas:"icon copy" "icon btn"}
  .dash-plugin .plugin-icon{grid-area:icon}
  .dash-plugin-copy{grid-area:copy}
  .dash-plugin .dash-soft-btn{grid-area:btn;width:fit-content;margin-top:8px}
  .dash-actions,.dash-steps{grid-template-columns:1fr}
}

/* —— Hosting —— */
.host-hero{padding:10px 0 6px}
.host-hero h1{margin:8px 0 12px;font-size:clamp(32px,5vw,48px);letter-spacing:-.05em;line-height:1}
.host-hero>p{margin:0;max-width:640px;color:#8aa0bc;font-size:16px;line-height:1.65}
.host-plans{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.host-plan{
  padding:24px;border:1px solid rgba(100,160,230,.2);border-radius:22px;
  background:linear-gradient(160deg,rgba(14,32,60,.92),rgba(6,14,28,.96));
}
.host-plan.pro{border-color:rgba(120,190,255,.4);box-shadow:0 16px 50px rgba(40,120,255,.18)}
.host-plan .mono{margin:0 0 8px;color:#62d6ff;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.host-plan h2{margin:0 0 10px;font-size:28px;letter-spacing:-.04em}
.host-plan strong{font-size:36px;letter-spacing:-.04em}
.host-plan>span{color:#7f96b4;font-size:13px}
.host-plan>p{margin:14px 0;color:#9db4d0;line-height:1.55}
.host-plan ul{margin:0 0 20px;padding:0;list-style:none;display:grid;gap:8px;color:#c5d5ea;font-size:14px}
.host-plan li:before{content:"✓ ";color:#62d6ff;font-weight:900}
.host-plan .dash-loader-btn{width:100%}
.host-form{display:grid;gap:14px}
.host-form label{display:grid;gap:6px;color:#9db4d0;font-size:13px}
.host-form input{
  min-height:46px;padding:0 14px;border:1px solid rgba(100,160,230,.22);border-radius:12px;
  background:rgba(4,14,30,.7);color:#eaf3ff;font:inherit;
}
.host-pick-title{margin:4px 0 10px;color:#c5d5ea}
.host-promo{display:grid;gap:8px;max-height:320px;overflow:auto;padding-right:4px}
.host-promo-item{
  display:grid;grid-template-columns:22px 44px 1fr;align-items:center;gap:12px;padding:12px;
  border:1px solid rgba(100,160,230,.18);border-radius:14px;background:rgba(8,22,44,.5);cursor:pointer;
}
.host-promo-item b,.host-promo-item small{display:block}
.host-promo-item small{color:#7f96b4;margin-top:2px}
.host-promo-item .plugin-icon{width:44px;height:44px;border-radius:12px}
.host-status-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.host-status-grid div{padding:14px;border:1px solid rgba(100,160,230,.16);border-radius:14px;background:rgba(4,14,30,.45)}
.host-status-grid small{display:block;color:#7f96b4;font-size:11px;margin-bottom:4px}
.host-metrics{border:1px solid rgba(100,160,230,.16);border-radius:16px;overflow:hidden;margin-bottom:12px}
.host-note{color:#8aa0bc;font-size:13px}
.host-setup-lead{color:#8aa0bc;line-height:1.6}
@media(max-width:760px){
  .host-plans,.host-status-grid{grid-template-columns:1fr}
}

.host-pay-actions{display:grid;gap:10px;margin:18px 0 10px}
.host-pay-actions .modal-action,.host-pay-actions .dash-soft-btn{width:100%;text-align:center}
.host-modal-plugins{margin-top:8px}
#modal .host-promo{max-height:220px}
#modal .host-form{margin-top:14px;text-align:left}

.host-checkout{text-align:left}
.host-checkout-pill{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:14px;padding:6px 12px;
  border:1px solid rgba(100,170,255,.28);border-radius:999px;background:rgba(20,50,100,.45);
  color:#d7e7ff;font-size:12px;font-weight:800;
}
.host-checkout-pill b{
  padding:2px 7px;border-radius:999px;background:linear-gradient(135deg,#5ec8ff,#3a78ff);
  color:#041028;font-size:10px;
}
.host-checkout-kicker{margin:0;color:#7f96b4;font-size:11px;font-weight:900;letter-spacing:.12em}
.host-checkout-until{margin:8px 0 6px;font-size:clamp(28px,4vw,36px);letter-spacing:-.04em;line-height:1.1}
.host-checkout-day{margin:0 0 18px;color:#8aa0bc;font-size:14px}
.host-period-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:20px}
.host-period{
  display:grid;gap:4px;min-height:88px;padding:12px 10px;border:1px solid rgba(100,160,230,.18);
  border-radius:16px;background:rgba(8,20,40,.72);color:inherit;font:inherit;text-align:left;cursor:pointer;
  transition:border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.host-period:hover{transform:translateY(-1px)}
.host-period span{color:#9db4d0;font-size:12px}
.host-period strong{font-size:18px;letter-spacing:-.03em}
.host-period em{font-style:normal;color:#6ec4ff;font-size:11px;font-weight:800}
.host-period em.green{color:#4ce0a0}
.host-period.on{
  border-color:rgba(90,180,255,.65);background:rgba(20,60,120,.45);
  box-shadow:0 0 0 1px rgba(90,180,255,.25),0 12px 30px rgba(40,120,255,.2);
}
.host-pay-title{margin:0 0 10px;font-size:16px}
.host-method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}
.host-method{
  display:grid;gap:4px;min-height:78px;padding:12px;border:1px solid rgba(100,160,230,.18);
  border-radius:16px;background:rgba(8,20,40,.72);color:inherit;font:inherit;text-align:left;cursor:pointer;
  transition:border-color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.host-method:hover{transform:translateY(-1px)}
#host-checkout-total,#host-checkout-pay{transition:opacity .15s ease}
.host-method b{font-size:14px}
.host-method small{color:#7f96b4;font-size:11px}
.host-method.on{
  border-color:rgba(90,180,255,.65);background:rgba(20,60,120,.45);
  box-shadow:0 0 0 1px rgba(90,180,255,.25);
}
.host-checkout-foot{
  display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:10px;
}
.host-checkout-foot span{display:block;color:#7f96b4;font-size:12px}
.host-checkout-foot strong{font-size:28px;letter-spacing:-.04em}
.host-checkout-foot .dash-loader-btn{min-width:160px}
@media(max-width:760px){
  .host-period-grid,.host-method-grid{grid-template-columns:1fr 1fr}
  .host-checkout-foot{flex-direction:column;align-items:stretch}
  .host-checkout-foot .dash-loader-btn{width:100%}
}