:root{--bg-0: #101c2d;--bg-1: #172a40;--ink: #f8fbff;--muted: #b5c3d5;--accent: #55c4ff;--accent-2: #70ead2;--accent-soft: rgba(85, 196, 255, .2);--danger: #ff6b7a;--danger-soft: rgba(255, 107, 122, .18);--card: rgba(27, 45, 67, .7);--card-border: rgba(201, 224, 255, .22);--shadow: 0 20px 55px rgba(3, 10, 22, .34);--font-display: "Onest", "Manrope", sans-serif;--font-body: "Manrope", sans-serif;--font-amount: "Onest", "Manrope", sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:var(--font-body);color:var(--ink);background:radial-gradient(ellipse 90% 55% at 50% -15%,rgba(85,196,255,.3),transparent 58%),radial-gradient(circle at 85% 82%,rgba(112,234,210,.12),transparent 34%),linear-gradient(165deg,var(--bg-0),var(--bg-1) 55%,#102136);background-size:120% 120%,130% 130%,100% 100%;animation:backgroundDrift 16s ease-in-out infinite alternate}.shell{min-height:100dvh;display:grid;place-items:center;padding:28px 16px 36px;position:relative;overflow:hidden}.stars{position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(1px 1px at 12% 18%,rgba(255,255,255,.35),transparent),radial-gradient(1px 1px at 72% 28%,rgba(255,255,255,.28),transparent),radial-gradient(1.5px 1.5px at 42% 62%,rgba(255,255,255,.22),transparent),radial-gradient(1px 1px at 88% 74%,rgba(255,255,255,.3),transparent),radial-gradient(1px 1px at 28% 84%,rgba(255,255,255,.2),transparent);pointer-events:none;opacity:.7;animation:starsGlow 5s ease-in-out infinite alternate}.geo{position:absolute;pointer-events:none;opacity:.64;filter:blur(2px);animation:float 12s ease-in-out infinite alternate}.geo-a{width:58vmax;height:58vmax;top:-20%;left:-24%;background:linear-gradient(135deg,rgba(85,196,255,.3),transparent 62%);clip-path:polygon(18% 0%,100% 18%,72% 100%,0% 68%)}.geo-b{width:46vmax;height:46vmax;right:-20%;top:8%;background:linear-gradient(200deg,rgba(112,234,210,.22),transparent 65%);clip-path:polygon(28% 0%,100% 38%,68% 100%,0% 58%);animation-delay:-4s}.geo-c{width:42vmax;height:42vmax;left:18%;bottom:-24%;background:linear-gradient(20deg,rgba(113,146,255,.2),transparent 60%);clip-path:polygon(8% 22%,92% 0%,100% 78%,0% 100%);animation-delay:-8s}.pay-layout{position:relative;z-index:1;width:min(420px,100%);display:flex;flex-direction:column;gap:12px;animation:rise .65s cubic-bezier(.22,1,.36,1) both}.pay-top{text-align:center;padding:4px 8px 10px}.pay-title{margin:0;font-family:var(--font-display);font-size:clamp(1.45rem,4.8vw,1.7rem);font-weight:700;letter-spacing:-.01em}.pay-amount{margin:12px 0 0;font-family:var(--font-amount);font-size:clamp(2.35rem,8vw,2.95rem);font-weight:700;letter-spacing:0;line-height:1.1;font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}.rub{font-weight:600;margin-left:4px;font-size:.92em}.glass{border:1px solid var(--card-border);border-radius:20px;background:var(--card);box-shadow:var(--shadow);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}.info-row{display:flex;gap:14px;align-items:flex-start;padding:14px;animation:cardIn .55s cubic-bezier(.22,1,.36,1) both}.info-row:nth-of-type(2){animation-delay:.08s}.info-row:hover{transform:translateY(-2px);border-color:#c9e0ff57;box-shadow:0 22px 55px #030a166b}.info-icon{width:44px;height:44px;border-radius:12px;background:#ffffff1f;display:grid;place-items:center;flex-shrink:0}.info-logo{width:28px;height:28px;object-fit:contain}.timer-badge{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#ff9b4a;box-shadow:inset 0 0 0 2px #ff9b4ab3}.info-body{min-width:0}.info-title{margin:0 0 4px;font-weight:700;font-size:.98rem}.info-text{margin:0;color:var(--muted);font-size:.84rem;line-height:1.4}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;cursor:pointer;font:inherit;font-weight:700;border-radius:16px;padding:14px 16px;width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;position:relative;overflow:hidden;transition:transform .2s ease,opacity .2s ease,box-shadow .2s ease}.btn:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.28),transparent 70%);transform:translate(-130%);transition:transform .65s ease;pointer-events:none}.btn:hover:after{transform:translate(130%)}.btn:disabled{opacity:.55;cursor:wait}.btn.cta{color:#061018;background:linear-gradient(135deg,#55c4ff,#83dcff);box-shadow:0 14px 32px #3db8ff59;justify-content:space-between;padding:10px 10px 10px 14px;min-height:56px}.cta-left,.cta-right{width:36px;height:36px;display:grid;place-items:center}.cta-right{border-radius:50%;background:#0610182e;color:#061018}.cta-label{flex:1;text-align:center;font-size:1rem}.btn.solid{color:#061018;background:linear-gradient(135deg,#49b9f7,#78d5ff);box-shadow:0 12px 28px #3db8ff4d}.btn.ghost{color:var(--ink);background:#ffffff17;border:1px solid var(--card-border)}.btn.dashed{color:var(--ink);background:transparent;border:1.5px dashed rgba(180,205,240,.35)}.btn-ico{width:34px;height:34px;border-radius:10px;background:#06101829;display:grid;place-items:center}.btn:hover:not(:disabled){transform:translateY(-2px) scale(1.005);box-shadow:0 16px 34px #3db8ff57}.btn:active:not(:disabled){transform:translateY(0) scale(.99)}.process-card,.status-card,.qr-card{padding:26px 20px 22px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;animation:cardIn .55s cubic-bezier(.22,1,.36,1) both}.process-icon{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:#f4f7fb;color:#1a8fd6;box-shadow:0 0 0 7px #55c4ff29;animation:softPulse 1.8s ease-in-out infinite}.process-icon svg{width:32px;height:32px}.status-title{margin:0;font-family:var(--font-display);font-size:1.35rem;font-weight:800;letter-spacing:-.02em}.status-title.danger{color:var(--danger)}.status-text{margin:0;color:var(--muted);font-size:.94rem;line-height:1.45;max-width:32ch}.progress-block{width:100%;margin-top:8px;text-align:left}.progress-meta{display:flex;justify-content:space-between;gap:12px;font-size:.86rem;color:var(--muted);margin-bottom:8px}.progress-meta strong{color:var(--ink);font-weight:700;white-space:nowrap}.progress-track{height:4px;border-radius:999px;background:#ffffff1a;overflow:hidden}.progress-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:width .4s linear;box-shadow:0 0 12px #55c4ffa6}.qr-wrap{padding:12px;border-radius:16px;background:#f4f7fb;box-shadow:0 12px 35px #030a1642,0 0 0 1px #ffffffa6;animation:qrReveal .65s cubic-bezier(.22,1,.36,1) both}.qr-wrap.dim{opacity:.55;filter:grayscale(.25)}.qr-hint{margin:2px 0 0;font-size:.92rem;color:var(--muted)}.pill{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;font-size:.86rem;font-weight:700}.pill.live{background:#5ee0c824;color:var(--accent-2);box-shadow:inset 0 0 0 1px #5ee0c847;animation:liveGlow 2s ease-in-out infinite}.pill.danger{background:var(--danger-soft);color:var(--danger);box-shadow:inset 0 0 0 1px #ff6b7a59}.badge-circle{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;animation:badgePop .55s cubic-bezier(.22,1,.36,1) both}.badge-circle.danger{background:var(--danger-soft);color:var(--danger);box-shadow:inset 0 0 0 2px #ff6b7a66}.brands-card{margin-top:4px;padding:16px 14px 12px;display:flex;flex-direction:column;gap:12px;align-items:center;animation:cardIn .55s .14s cubic-bezier(.22,1,.36,1) both}.pay-logos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 18px;width:100%}.pay-logo{height:22px;width:auto;object-fit:contain;display:block}.pay-logo.mir{height:18px}.pay-logo.visa{height:16px}.pay-logo.mc{height:24px}.pay-logo.nspk{height:18px}.pay-logo.sbp{height:26px}.security-note{margin:0;display:flex;align-items:flex-start;justify-content:center;gap:8px;color:var(--muted);font-size:.76rem;line-height:1.4;text-align:left;max-width:34ch}.security-note svg{flex-shrink:0;margin-top:1px;opacity:.9}.spinner{width:36px;height:36px;border-radius:50%;border:3px solid rgba(243,246,251,.12);border-top-color:var(--accent);animation:spin .8s linear infinite}@keyframes rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes cardIn{0%{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes qrReveal{0%{opacity:0;transform:scale(.88) rotate(-2deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes badgePop{0%{opacity:0;transform:scale(.72)}70%{transform:scale(1.08)}to{opacity:1;transform:scale(1)}}@keyframes backgroundDrift{0%{background-position:50% 0%,90% 85%,0 0}to{background-position:45% 5%,78% 70%,0 0}}@keyframes starsGlow{0%{opacity:.45}to{opacity:.85}}@keyframes liveGlow{0%,to{box-shadow:inset 0 0 0 1px #70ead24d,0 0 #70ead200}50%{box-shadow:inset 0 0 0 1px #70ead27a,0 0 18px #70ead229}}@keyframes float{0%{transform:translateY(0) rotate(0)}to{transform:translateY(16px) rotate(3deg)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes softPulse{0%,to{box-shadow:0 0 0 7px #3db8ff1f;transform:scale(1)}50%{box-shadow:0 0 0 12px #3db8ff0f;transform:scale(1.03)}}@media(max-width:480px){.pay-layout{gap:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
