/* A short, finite payment-completion sequence. */
.quick-pay{position:relative;overflow:hidden}
.quick-pay.is-processing{opacity:1;cursor:wait;background:#3f5135}
.quick-pay.is-processing>svg{display:none}
.quick-pay.is-processing::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent 15%,#ffffff10 48%,transparent 80%);transform:translateX(-100%);animation:payment-sheen .9s ease-in-out infinite;pointer-events:none}
.pay-spinner{width:16px;height:16px;border:1.5px solid #ffffff40;border-top-color:#fff;border-radius:50%;flex-shrink:0;animation:payment-spin .65s linear infinite}
.quick-payment.is-completing{animation:payment-exit .16s ease both;pointer-events:none}
.is-checkout .motion-result{animation:none;position:relative;width:100%}
.success-scene{position:relative;width:148px;height:112px;margin:0 auto 22px}
.success-ring{position:absolute;inset:0;width:112px;height:112px;margin:auto;transform:rotate(-90deg);overflow:visible}
.ring-track{stroke:#dce6d2;stroke-width:1;opacity:.45}
.ring-draw{stroke:#a8c192;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;animation:success-ring .65s .08s cubic-bezier(.3,.6,.3,1) both}
.success-scene .result-icon{position:absolute;top:19px;left:37px;width:74px;height:74px;margin:0;background:#e9f0df;border-color:#d5e2c7;animation:success-pop .6s cubic-bezier(.2,.7,.2,1) both}
.success-scene .result-icon::after{content:'';position:absolute;inset:-1px;border:1px solid #a6c18c;border-radius:50%;opacity:0;animation:success-halo 1s .16s ease-out both}
.success-check{width:32px;height:32px}
.success-check path{stroke-dasharray:100;stroke-dashoffset:100;animation:success-check .48s .26s cubic-bezier(.4,0,.2,1) both}
.success-burst{position:absolute;inset:0;pointer-events:none}
.success-burst i{position:absolute;top:56px;left:72px;width:4px;height:7px;border-radius:2px;background:#a1b98a;opacity:0;animation:success-particle .95s .26s cubic-bezier(.1,.6,.2,1) both}
.success-burst i:nth-child(3n){background:#d5c394}
.success-burst i:nth-child(2n){width:4px;height:4px;border-radius:50%;background:#bac9a8}
.motion-result>.eyebrow,.motion-result>h1,.motion-result>p,.motion-result>.result-total,.motion-result>.result-actions{animation:success-content .55s cubic-bezier(.2,.7,.2,1) both}
.motion-result>.eyebrow{animation-delay:.18s}
.motion-result>h1{animation-delay:.25s;outline:none}
.motion-result>p{animation-delay:.32s}
.motion-result>.result-total{animation-delay:.38s;font-variant-numeric:tabular-nums}
.motion-result>.result-actions{animation-delay:.46s}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes payment-spin{to{transform:rotate(360deg)}}
@keyframes payment-sheen{to{transform:translateX(100%)}}
@keyframes payment-exit{to{opacity:0;transform:translateY(-5px) scale(.985)}}
@keyframes success-ring{to{stroke-dashoffset:0}}
@keyframes success-check{to{stroke-dashoffset:0}}
@keyframes success-pop{0%{opacity:0;transform:scale(.55)}60%{opacity:1;transform:scale(1.08)}82%{transform:scale(.98)}100%{opacity:1;transform:scale(1)}}
@keyframes success-halo{0%{opacity:.55;transform:scale(.9)}100%{opacity:0;transform:scale(1.8)}}
@keyframes success-particle{0%{opacity:0;transform:translate(0,0) scale(.1)}15%{opacity:1}75%{opacity:.65}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--turn)) scale(.6)}}
@keyframes success-content{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-height:660px){
  .success-scene{height:90px;margin-bottom:14px}
  .success-ring{width:90px;height:90px}
  .success-scene .result-icon{top:12px;left:41px;width:66px;height:66px}
  .success-burst i{top:45px}
  .is-checkout .motion-result{padding:8px 0}
  .is-checkout .motion-result h1{font-size:28px;line-height:1.2;margin:10px 0}
  .is-checkout .motion-result>p{font-size:11px;line-height:1.7}
  .is-checkout .motion-result>.result-total{font-size:28px;margin:16px 0}
  .motion-result .result-back{margin-top:16px}
}
@media(prefers-reduced-motion:reduce){
  .quick-pay.is-processing::after,.success-burst,.success-scene .result-icon::after{display:none}
  .pay-spinner,.quick-payment.is-completing,.success-scene .result-icon,.ring-draw,.success-check path,.motion-result>*{animation:none!important}
  .ring-draw,.success-check path{stroke-dashoffset:0}
  .quick-payment.is-completing{opacity:1;transform:none}
}