.pay-shell { position:relative; margin-top:-100px; margin-bottom:48px; z-index:2; font-family:"Prompt",sans-serif; color:#305175; }
.pay-panel { background:#fff; border:1px solid #e4edf8; border-radius:28px; padding:38px; box-shadow:0 14px 45px #1947750c; }
.pay-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-bottom:24px; }
.pay-eyebrow { font-size:11px; letter-spacing:2px; color:#6083a8; }
.pay-heading h1 { font-family:inherit; font-weight:700; font-size:clamp(24px,3vw,34px); color:#245283; margin:9px 0; }
.pay-heading p { margin:0; font-size:14px; color:#7b8ea5; }
.pay-channel { display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border:1px solid #cee4fa; border-radius:30px; color:#2986cf; background:#f0f8ff; white-space:nowrap; font-size:12px; }
.pay-notice,.pay-error { padding:14px 18px; border-radius:12px; line-height:1.8; font-size:13px; margin-bottom:22px; }
.pay-notice { color:#8a692c; background:#fffaed; border:1px solid #f2e4bf; }
.pay-error { background:#fff1f1; color:#a04747; border:1px solid #f1d4d4; }
.pay-account-hint { display:flex; align-items:center; gap:15px; background:#f3f8ff; border:1px solid #e2edfa; border-radius:16px; padding:20px 22px; }
.pay-account-hint > i { color:#73afe0; font-size:34px; }
.pay-account-hint strong,.pay-account-hint span { display:block; }
.pay-account-hint strong { font-size:15px; font-weight:600; }
.pay-account-hint div span { font-size:12px; color:#7c92aa; margin-top:3px; }
.pay-account-hint > a { margin-left:auto; white-space:nowrap; color:#1686d9; font-size:13px; }
.pay-account-hint > a span { display:inline; }
.pay-balances { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #dce9f9; border-radius:16px; overflow:hidden; background:#f6faff; }
.pay-balances > div { padding:20px 25px; }
.pay-balances > div + div { border-left:1px solid #dce9f9; }
.pay-balances strong { display:block; color:#2f7bb9; font-size:28px; margin:6px 0; overflow-wrap:anywhere; }
.pay-balances span,.pay-balances small,.pay-balances a { font-size:12px; color:#6f88a3; }
.pay-tabs { display:flex; gap:24px; border-bottom:1px solid #e7eef7; margin:28px 0; }
.pay-tabs button { border:0; border-bottom:3px solid transparent; background:transparent; color:#8b9bb0; padding:14px 0; font-family:inherit; font-size:15px; font-weight:500; }
.pay-tabs button[aria-selected="true"] { color:#188ad8; border-bottom-color:#45adf0; }
.pay-layout { display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:30px; align-items:start; }
.pay-section-title { font-family:inherit; font-size:20px; font-weight:600; color:#315c88; margin:0 0 9px; }
.pay-section-title > span,.pay-checkout h2 > span { display:inline-flex; align-items:center; justify-content:center; width:29px; height:29px; border-radius:50%; font-size:12px; background:#e9f5ff; color:#218cd9; margin-right:7px; }
.pay-section-sub { color:#8293a8; font-size:12px; margin-bottom:20px; line-height:1.8; }
.pay-packages { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.pay-package { position:relative; cursor:pointer; }
.pay-package input { position:absolute; opacity:0; width:1px; height:1px; }
.pay-package__card { display:flex; flex-direction:column; position:relative; border:1px solid #dce7f5; border-radius:15px; padding:21px 14px 17px; background:#fff; transition:border-color .15s,background .15s; min-height:164px; }
.pay-package input:checked + .pay-package__card { border:2px solid #52adeb; padding:20px 13px 16px; background:#f0f9ff; box-shadow:0 4px 16px #4aace315; }
.pay-package input:focus-visible + .pay-package__card,.pay-shell a:focus-visible,.pay-shell button:focus-visible { outline:3px solid #277edb; outline-offset:3px; }
.pay-package__amount { font-size:25px; color:#285780; font-weight:600; }
.pay-package__amount small { font-size:11px; margin-left:5px; color:#7c91a8; font-weight:400; }
.pay-package__cash { font-size:20px; margin-top:8px; color:#2087cf; font-weight:600; }
.pay-package__cash small { display:block; font-size:10px; font-weight:400; margin-top:1px; color:#6986a2; }
.pay-package__bonus { color:#62966b; font-size:10px; margin-top:11px; }
.pay-package__check { position:absolute; right:12px; top:12px; color:#248acf; display:none; font-size:12px; }
.pay-package input:checked + span .pay-package__check { display:block; }
.pay-instructions { background:#f8fafc; border:1px solid #eaf0f7; border-radius:14px; padding:20px; margin-top:22px; }
.pay-instructions h3 { font-family:inherit; font-size:14px; font-weight:600; margin:0 0 12px; }
.pay-instructions ol { padding-left:20px; font-size:12px; color:#6e849d; line-height:2; margin-bottom:12px; }
.pay-instructions p { font-size:11px; color:#8696a9; line-height:1.9; margin:0; }
.pay-checkout { position:sticky; top:85px; border:1px solid #dce9f7; border-radius:20px; overflow:hidden; background:#fff; }
.pay-checkout__art { height:138px; background:#fff2f6; overflow:hidden; }
.pay-checkout__art img { width:100%; height:100%; object-fit:cover; object-position:center 44%; }
.pay-checkout__body { padding:24px; }
.pay-checkout h2 { font-family:inherit; font-size:16px; font-weight:600; margin:0 0 22px; }
.pay-summary { margin:0 0 22px; }
.pay-summary > div { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:10px 0; }
.pay-summary > div:first-child { border-bottom:1px solid #eaf0f8; margin-bottom:10px; padding-bottom:18px; }
.pay-summary dt { font-size:12px; color:#7c91a9; font-weight:400; }
.pay-summary dd { margin:0; font-size:14px; color:#347eb6; }
.pay-summary dd strong { font-size:27px; font-weight:600; }
.pay-summary > div:last-child dd { color:#5b966a; }
.pay-primary { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; border:0; border-radius:10px; padding:14px 12px; background:linear-gradient(120deg,#50baf4,#5774df); color:#fff; font-family:inherit; font-size:13px; font-weight:500; text-decoration:none; line-height:1.5; }
.pay-primary:hover { color:#fff; filter:brightness(1.05); }
.pay-primary:disabled { background:#e8eef5; color:#8598af; cursor:not-allowed; filter:none; }
.pay-register { display:block; text-align:center; color:#7893af; font-size:11px; margin-top:15px; }
.pay-secondary { border:1px solid #bfdbf3; border-radius:9px; color:#367daf; background:#fff; padding:9px 14px; font-size:12px; font-family:inherit; }
.pay-secondary:disabled { opacity:.5; }
.pay-checkout__note { font-size:10px; color:#8b9db1; text-align:center; line-height:1.8; margin:13px 0 0; }
.pay-feedback { font-size:12px; color:#3c779e; line-height:1.8; margin:12px 0 0; overflow-wrap:anywhere; }
.pay-feedback.is-error { color:#aa5151; }
.pay-qr { text-align:center; border-top:1px solid #e4eef8; margin-top:20px; padding-top:20px; }
.pay-qr__amount { font-size:14px; color:#325e88; }
.pay-qr > img { display:block; width:100%; max-width:280px; height:auto; aspect-ratio:1; object-fit:contain; background:#fff; margin:14px auto; }
.pay-qr p,.pay-qr code { font-size:11px; overflow-wrap:anywhere; }
.pay-qr code { display:block; color:#718aa4; margin-bottom:18px; }
.pay-history-head { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:15px; }
.pay-history-head p { margin-bottom:0; }
.pay-table-wrap { overflow-x:auto; }
.pay-table { width:100%; min-width:610px; border-collapse:collapse; font-size:12px; }
.pay-table th { font-weight:500; background:#f0f7ff; color:#6c8ba9; padding:15px 12px; text-align:left; }
.pay-table td { padding:16px 12px; border-bottom:1px solid #edf1f7; }
.pay-table td small { display:block; margin-top:5px; color:#8a9cb0; font-size:10px; }
.pay-status { border-radius:20px; font-size:10px; padding:5px 10px; display:inline-block; background:#fff6de; color:#987638; }
.pay-status[data-status="CREDITED"] { color:#3e8d65; background:#e9f8ef; }
.pay-status[data-status="REVIEW_REQUIRED"] { color:#ab5656; background:#fff0f0; }
.pay-status[data-status="EXPIRED"] { color:#8593a3; background:#f1f4f7; }
.pay-empty { padding:40px 15px; color:#90a0b2; text-align:center; font-size:13px; }
.pay-support { display:flex; justify-content:center; flex-wrap:wrap; gap:7px 16px; padding-top:28px; margin-top:28px; border-top:1px solid #edf2f8; font-size:11px; color:#879bb1; }
.pay-support a { color:#2989c9; }
.pay-shell [hidden] { display:none !important; }
@media (max-width:1199.98px) { .pay-layout { grid-template-columns:minmax(0,1fr) 300px; gap:22px; } .pay-packages { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:991.98px) { .pay-shell { margin-top:20px; } .pay-panel { padding:26px; } .pay-layout { grid-template-columns:1fr; } .pay-checkout { position:static; } .pay-checkout__art { height:180px; } .pay-packages { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:575.98px) {
  .pay-shell { margin-bottom:25px; padding:0 12px; }
  .pay-panel { border-radius:18px; padding:22px 16px; }
  .pay-heading { flex-wrap:wrap; padding-bottom:18px; gap:14px; }
  .pay-heading p { font-size:12px; }
  .pay-channel { padding:7px 12px; font-size:10px; }
  .pay-account-hint { display:grid; grid-template-columns:32px minmax(0,1fr); padding:16px; gap:10px; }
  .pay-account-hint > a { grid-column:2; margin-left:0; justify-self:start; }
  .pay-account-hint div { flex:1; }
  .pay-account-hint strong { font-size:12px; }
  .pay-account-hint div span { font-size:10px; }
  .pay-packages { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .pay-package__amount { font-size:23px; }
  .pay-package__cash { font-size:18px; }
  .pay-package__bonus { font-size:9px; }
  .pay-tabs { gap:20px; margin:20px 0; }
  .pay-tabs button { font-size:12px; }
  .pay-balances { grid-template-columns:1fr 1fr; }
  .pay-balances > div { padding:15px; }
  .pay-balances > div:first-child { grid-column:1/-1; border-bottom:1px solid #dce9f9; }
  .pay-balances > div:nth-child(2) { border-left:0; }
  .pay-balances strong { font-size:23px; }
  .pay-balances span,.pay-balances small,.pay-balances a { font-size:10px; }
  .pay-section-title { font-size:17px; }
}