:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#171819;--muted:#71736f;--line:#d9dcd5;--paper:#f1f2ed;--white:#fbfcf8;--acid:#d8ff45;--green:#216b47;--red:#c74636}*{box-sizing:border-box}html{background:var(--paper)}body{color:var(--ink);background:var(--paper);margin:0;font-family:Inter,SF Pro Display,Helvetica Neue,Arial,sans-serif}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.app-shell{background:var(--paper);width:min(1440px,100%);min-height:100vh;margin:0 auto;overflow:hidden}.topbar{border-bottom:1px solid #17181924;justify-content:space-between;align-items:center;height:84px;padding:0 clamp(24px,4.4vw,68px);display:flex}.brand{color:inherit;align-items:center;gap:12px;text-decoration:none;display:flex}.brand-mark{background:var(--ink);width:42px;height:42px;color:var(--acid);letter-spacing:-.04em;border-radius:50%;place-items:center;font-size:13px;font-weight:900;display:grid}.brand>span:last-child{line-height:1.08;display:grid}.brand b{letter-spacing:-.02em;font-size:15px}.brand small{color:var(--muted);margin-top:4px;font-size:11px}.environment{border:1px solid var(--line);background:#ffffff80;border-radius:999px;align-items:center;gap:9px;padding:9px 14px;font-size:12px;font-weight:700;display:flex}.environment span{background:#5fb26e;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #5fb26e24}.hero{background:var(--ink);min-height:376px;color:var(--white);grid-template-columns:1.45fr .55fr;align-items:end;gap:48px;padding:64px clamp(24px,4.4vw,68px) 58px;display:grid;position:relative}.hero:after{content:"";opacity:.14;background:repeating-linear-gradient(110deg,transparent 0 21px,var(--acid) 22px 23px);pointer-events:none;width:42%;position:absolute;inset:0 0 0 auto;-webkit-mask-image:linear-gradient(270deg,#000,#0000);mask-image:linear-gradient(270deg,#000,#0000)}.hero-copy,.hero-meta{z-index:1;position:relative}.eyebrow,.step{letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin:0 0 13px;font-size:11px;font-weight:800}.hero .eyebrow{color:var(--acid)}.hero h1{letter-spacing:-.073em;margin:0;font-size:clamp(48px,6.2vw,88px);font-weight:680;line-height:.91}.hero-copy>p:last-child{color:#b8bcb4;max-width:620px;margin:27px 0 0;font-size:16px;line-height:1.55}.hero-meta{grid-template-columns:46px 1fr;gap:14px 16px;padding-bottom:5px;display:grid}.hero-meta span{width:38px;height:38px;color:var(--acid);border:1px solid #d8ff4573;border-radius:50%;place-items:center;font-size:11px;font-weight:800;display:grid}.hero-meta p{color:#c7c9c4;margin:1px 0 0;font-size:13px;line-height:1.4}.workspace{border-bottom:1px solid var(--line);grid-template-columns:1.08fr .92fr;display:grid}.payment-panel,.result-panel{min-height:690px;padding:clamp(34px,4vw,58px) clamp(24px,4.4vw,68px)}.payment-panel{border-right:1px solid var(--line)}.result-panel{background:#e7e9e1}.section-heading{justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:30px;display:flex}.section-heading h2,.history-heading h2{letter-spacing:-.045em;margin:0;font-size:clamp(28px,3vw,40px);line-height:1.05}.safe-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding-top:4px;font-size:10px;font-weight:750}.method-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.method-card{appearance:none;text-align:left;min-height:104px;color:var(--ink);border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:14px;grid-template-columns:44px 1fr 18px;align-items:center;gap:13px;padding:18px;transition:background .18s,border-color .18s,transform .18s;display:grid}.method-card:hover{border-color:#aeb1aa;transform:translateY(-2px)}.method-card.active{background:var(--ink);border-color:var(--ink);color:var(--white)}.method-icon{width:42px;height:42px;color:var(--ink);background:#e3e6de;border-radius:50%;place-items:center;display:grid}.method-icon.sbp{color:#6b4dd6;background:#ece8ff}.method-icon svg,.history-method svg{fill:currentColor;width:21px;height:21px}.method-card b,.method-card small{display:block}.method-card b{margin-bottom:6px;font-size:15px}.method-card small{color:var(--muted);font-size:11px;line-height:1.3}.method-card.active small{color:#aeb2aa}.method-card i{border:1px solid #aeb1aa;border-radius:50%;width:16px;height:16px;position:relative}.method-card.active i{border-color:var(--acid)}.method-card.active i:after{content:"";background:var(--acid);border-radius:50%;position:absolute;inset:3px}.payment-form{gap:18px;margin-top:30px;display:grid}.field{gap:9px;display:grid}.field>span{font-size:12px;font-weight:750}.field input{width:100%;height:58px;color:var(--ink);border:1px solid var(--line);background:#ffffff94;border-radius:10px;outline:none;padding:0 17px;transition:border-color .18s,box-shadow .18s}.field input:focus{border-color:#73776f;box-shadow:0 0 0 3px #1718190f}.field small{color:var(--muted);font-size:10px;line-height:1.3}.amount-field>div{position:relative}.amount-field input{letter-spacing:-.04em;height:78px;padding-right:58px;font-size:32px;font-weight:720}.amount-field div b{font-size:24px;font-weight:600;position:absolute;top:50%;right:20px;transform:translateY(-50%)}.primary-button,.bank-button{background:var(--acid);min-height:60px;color:var(--ink);cursor:pointer;border:0;border-radius:10px;justify-content:space-between;align-items:center;gap:20px;padding:0 22px;font-size:14px;font-weight:800;text-decoration:none;transition:transform .18s,filter .18s;display:flex}.primary-button:hover,.bank-button:hover{filter:brightness(.97);transform:translateY(-2px)}.primary-button:disabled{opacity:.6;cursor:wait;transform:none}.form-note{text-align:center;color:var(--muted);margin:-4px 0 0;font-size:10px}.error-message{color:#8d261a;background:#f7ddd9;border-radius:9px;padding:13px 15px;font-size:12px;line-height:1.4}.empty-result{flex-direction:column;justify-content:flex-end;min-height:570px;display:flex}.empty-result h2{letter-spacing:-.06em;margin:0;font-size:clamp(38px,4vw,58px);line-height:.95}.empty-result>p:last-child{max-width:420px;color:var(--muted);margin:20px 0 0;font-size:14px;line-height:1.55}.empty-visual{flex:1;min-height:230px;position:relative}.empty-visual span{border:1px solid #bfc3b8;border-radius:50%;position:absolute}.empty-visual span:first-child{width:200px;height:200px;top:5%;right:6%}.empty-visual span:nth-child(2){background:var(--acid);border-color:var(--acid);width:126px;height:126px;top:17%;right:18%}.empty-visual span:nth-child(3){background:var(--ink);border-color:var(--ink);width:54px;height:54px;top:48%;right:6%}.payment-result{max-width:500px;margin:0 auto}.result-topline{justify-content:space-between;align-items:center;display:flex}.close-button{color:var(--ink);cursor:pointer;background:0 0;border:0;border-radius:50%;width:38px;height:38px;font-size:27px}.close-button:hover{background:#17181912}.result-label{color:var(--muted);text-transform:uppercase;letter-spacing:.13em;margin:30px 0 4px;font-size:11px;font-weight:750}.payment-result>h2{letter-spacing:-.065em;margin:0;font-size:clamp(43px,5vw,66px);line-height:1}.result-purpose{color:var(--muted);margin:10px 0 22px;font-size:13px}.qr-frame{aspect-ratio:1;background:var(--white);border-radius:18px;width:min(278px,80%);margin:16px auto 20px;padding:17px;box-shadow:0 18px 40px #17181917}.qr-frame img{object-fit:contain;width:100%;height:100%;display:block}.bank-button{background:var(--ink);color:var(--white)}.scan-note{max-width:340px;color:var(--muted);text-align:center;margin:12px auto 0;font-size:10px;line-height:1.4}.refresh-button{width:100%;height:50px;color:var(--ink);cursor:pointer;background:0 0;border:1px solid #c2c6bc;border-radius:10px;margin-top:18px;font-size:12px;font-weight:750}.refresh-button:hover{background:#fff6}.refresh-button span{margin-right:8px;display:inline-block}.refresh-button .spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.tender-success{background:var(--acid);border-radius:50%;place-items:center;width:108px;height:108px;margin:32px 0 24px;display:grid;box-shadow:0 0 0 12px #d8ff4538}.tender-success span{font-size:44px;font-weight:700;line-height:1}.tender-success.paid{background:#62c584;box-shadow:0 0 0 12px #62c5842e}.tender-success.failed{background:#ef9b90;box-shadow:0 0 0 12px #c746361f}.payment-timeline{background:#fbfcf88a;border:1px solid #c8cbc3;border-radius:13px;gap:0;margin:28px 0 20px;padding:19px 20px;display:grid}.payment-timeline div{color:#8a8d86;align-items:center;gap:12px;min-height:42px;font-size:11px;font-weight:700;display:flex;position:relative}.payment-timeline div:not(:last-child):after{content:"";background:#c7cac2;width:1px;height:27px;position:absolute;top:27px;left:5px}.payment-timeline i{background:#e7e9e1;border:2px solid #aeb2aa;border-radius:50%;flex:none;width:11px;height:11px}.payment-timeline .done{color:var(--ink)}.payment-timeline .done i{border-color:var(--green);background:var(--green)}.payment-timeline .done:not(:last-child):after{background:var(--green)}.return-link{color:var(--ink);text-align:center;text-underline-offset:4px;margin-top:18px;font-size:12px;font-weight:800;text-decoration:underline;display:block}.requisites{background:#cacdc5;border:1px solid #cacdc5;border-radius:13px;gap:1px;margin-top:24px;display:grid;overflow:hidden}.requisites>div{background:#fbfcf8b8;gap:6px;padding:15px;display:grid;position:relative}.requisites small{color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-size:9px}.requisites b{overflow-wrap:anywhere;max-width:calc(100% - 100px);font-size:12px;line-height:1.35}.copy-button{background:var(--ink);color:var(--white);cursor:pointer;border:0;border-radius:7px;padding:7px 9px;font-size:9px;position:absolute;bottom:11px;right:10px}.requisites-row{grid-template-columns:1fr 1fr!important}.requisites-row span{gap:5px;display:grid}.requisites-row b{max-width:none}.status{white-space:nowrap;text-transform:uppercase;letter-spacing:.06em;align-items:center;gap:7px;font-size:10px;font-weight:800;display:inline-flex}.status:before{content:"";background:#90938d;border-radius:50%;width:7px;height:7px}.status.waiting:before,.status.created:before{background:#e19f29}.status.paid:before{background:#42a865}.status.failed:before{background:var(--red)}.history-section{padding:56px clamp(24px,4.4vw,68px) 72px}.history-heading{justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:26px;display:flex}.history-heading button{color:var(--muted);cursor:pointer;background:0 0;border:0;font-size:11px;font-weight:700}.history-list{border-top:1px solid var(--line)}.history-row{width:100%;color:var(--ink);text-align:left;border:0;border-bottom:1px solid var(--line);cursor:pointer;background:0 0;grid-template-columns:44px minmax(180px,1fr) 120px 140px 24px;align-items:center;gap:16px;padding:17px 4px;display:grid}.history-row:hover{background:#fff6}.history-method{background:#e0e3db;border-radius:50%;place-items:center;width:38px;height:38px;display:grid}.history-method.sbp{color:#654acc;background:#e8e3ff}.history-main{gap:5px;min-width:0;display:grid}.history-main b{text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.history-main small{color:var(--muted);font-size:10px}.history-row>strong{text-align:right;font-size:14px}.row-arrow{text-align:right}.empty-history{color:var(--muted);padding:35px 0;font-size:13px}footer{color:#aeb2a9;background:var(--ink);text-transform:uppercase;letter-spacing:.08em;justify-content:space-between;align-items:center;gap:20px;min-height:82px;padding:0 clamp(24px,4.4vw,68px);font-size:10px;display:flex}@media (max-width:900px){.hero{grid-template-columns:1fr}.hero-meta{display:none}.workspace{grid-template-columns:1fr}.payment-panel{border-right:0;border-bottom:1px solid var(--line)}.payment-panel,.result-panel{min-height:auto}.empty-result{min-height:480px}}@media (max-width:620px){.topbar{height:72px}.hero{min-height:330px;padding-top:50px}.hero h1{font-size:48px}.hero-copy>p:last-child{font-size:14px}.section-heading{display:block}.safe-label{margin-top:12px;display:block}.method-grid{grid-template-columns:1fr}.method-card{min-height:88px}.history-row{grid-template-columns:40px minmax(0,1fr) auto}.history-row .status{display:none}.history-row>strong{text-align:left;grid-column:2}.row-arrow{grid-area:1/3/3}footer{flex-direction:column;justify-content:center;align-items:flex-start}}