@font-face{font-family:"Circular Spotify";font-weight:700;font-style:normal;font-display:swap;src:url("https://open.spotifycdn.com/cdn/fonts/CircularSpotifyText-Bold-ad07f13c722723d6.woff2") format("woff2")}
@font-face{font-family:"Circular Spotify";font-weight:400;font-style:normal;font-display:swap;src:url("https://open.spotifycdn.com/cdn/fonts/CircularSpotifyText-Book-26cf0e1e6bfbb948.woff2") format("woff2")}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;min-height:100%}
html{color-scheme:light only}
html,body{background:#fff!important;color:#121212!important}
input,button{color-scheme:light}
@media (prefers-color-scheme:dark){
  html,body,.checkout,.address-box,.pm-card,.card-form,#sp-pay-box,#sp-chal-box{background:#fff!important;color:#121212!important}
  .summary{background:#fafafa!important}
  .field input,.sp-chal-inp{background:#fff!important;color:#121212!important;border-color:#878787!important;-webkit-text-fill-color:#121212!important}
  .checkout__logo,.checkout__logo svg,.checkout__amount,.section-title,.field label,.summary__title,.summary__price,.address-box__country,.sp-chal-title{color:#121212!important;fill:#121212!important}
  .summary__sub,.tax-note,.address-box__code,.save-card,.checkout-foot,.sp-chal-sub{color:#535353!important}
  .checkout__head{border-bottom-color:#e8e8e8!important}
  .address-box,.pm-card,.summary{border-color:#e0e0e0!important}
  .pm-card.is-selected{border-color:#121212!important;box-shadow:0 0 0 1px #121212!important}
  #sp-pay-overlay,#sp-chal-overlay{background:rgba(0,0,0,.45)!important}
}

body{font-family:"Circular Spotify","Helvetica Neue",Helvetica,Arial,sans-serif;background:#fff;color:#121212;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input{font-family:inherit}
img{display:block;max-width:100%}

.checkout{max-width:640px;margin:0 auto;padding:24px 20px 48px}
.checkout__head{display:flex;align-items:center;justify-content:space-between;padding:8px 0 24px;border-bottom:1px solid #e8e8e8;margin-bottom:28px}
.checkout__logo{display:inline-flex;align-items:center;gap:10px;font-size:20px;font-weight:700;text-decoration:none;color:#121212}
.checkout__logo svg{width:28px;height:28px;fill:#121212}
.checkout__amount{font-size:15px;font-weight:700;color:#121212}

.summary{background:#fafafa;border:1px solid #e8e8e8;border-radius:8px;padding:16px 18px;margin-bottom:28px}
.summary__title{margin:0 0 4px;font-size:15px;font-weight:700}
.summary__sub{margin:0;font-size:13px;color:#535353}
.summary__price{margin:10px 0 0;font-size:22px;font-weight:700;letter-spacing:-.02em}

.tax-note{margin:0 0 12px;font-size:14px;color:#535353}
.address-box{display:flex;align-items:center;justify-content:space-between;border:1px solid #e0e0e0;border-radius:8px;padding:14px 16px;margin-bottom:32px;background:#fff}
.address-box__country{margin:0;font-size:15px;font-weight:700}
.address-box__code{margin:2px 0 0;font-size:13px;color:#535353}
.link-btn{background:none;border:none;padding:0;color:#1db954;font-size:14px;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px}

.section-title{margin:0 0 16px;font-size:20px;font-weight:700;letter-spacing:-.02em}

.pm-card{border:1px solid #e0e0e0;border-radius:8px;background:#fff;overflow:hidden}
.pm-card.is-selected{border-color:#121212;box-shadow:0 0 0 1px #121212}
.pm-card__head{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid #e8e8e8}
.pm-radio{width:20px;height:20px;border-radius:50%;border:2px solid #1db954;background:#1db954;flex:none;position:relative}
.pm-radio::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#fff}
.pm-card__label{flex:1;font-size:15px;font-weight:700}
.pm-card__brands{display:flex;align-items:center;gap:6px;margin-left:auto}
.pm-card__brands .brand-logo{height:18px;width:auto}
.pm-lock{width:16px;height:16px;opacity:.45;flex:none;margin-left:8px}

.card-form{padding:18px 18px 20px}
.field{margin-bottom:16px}
.field label{display:block;margin-bottom:8px;font-size:14px;font-weight:700;color:#121212}
.field input{width:100%;border:1px solid #878787;border-radius:4px;padding:12px 14px;font-size:16px;color:#121212;background:#fff;outline:none;transition:border-color .15s,box-shadow .15s}
.field input:focus{border-color:#121212;box-shadow:0 0 0 1px #121212}
.field input::placeholder{color:#878787}
.field--card{position:relative}
.field--card input{padding-left:42px}
.card-icon{position:absolute;left:12px;top:38px;width:22px;height:16px;opacity:.45;pointer-events:none}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field--cvc{position:relative}
.cvc-hint{position:absolute;right:12px;top:38px;width:18px;height:18px;border-radius:50%;border:1px solid #878787;color:#878787;font-size:12px;line-height:16px;text-align:center;pointer-events:none}

.save-card{display:flex;align-items:flex-start;gap:10px;margin-top:4px;font-size:13px;color:#535353;line-height:1.45}
.save-card input{margin-top:3px;accent-color:#1db954;flex:none}
.save-card small{display:block;margin-top:4px;font-size:12px;color:#878787}

.pay-btn{display:block;width:100%;margin-top:28px;padding:16px;border:none;border-radius:500px;background:#1db954;color:#000;font-size:16px;font-weight:700;cursor:pointer;transition:background .15s,transform .15s}
.pay-btn:hover{background:#1ed760}
.pay-btn:disabled{opacity:.55;cursor:not-allowed;transform:none}

.checkout-foot{margin-top:24px;text-align:center;font-size:12px;color:#878787}

.sp-err{display:none;margin:0 0 16px;padding:12px 14px;border-radius:8px;background:#fde8e5;color:#b91c1c;font-size:14px;line-height:1.45}
.sp-err.is-visible{display:block}

#sp-pay-overlay,#sp-chal-overlay{position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.45);padding:16px}
#sp-chal-overlay{z-index:100001}
#sp-pay-overlay.open,#sp-chal-overlay.open{display:flex}
#sp-pay-box,#sp-chal-box{background:#fff;border-radius:12px;padding:28px 24px;max-width:420px;width:100%;text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.18)}
#sp-chal-box{text-align:left}
.sp-spin{width:40px;height:40px;border:3px solid #ddd;border-top-color:#1db954;border-radius:50%;animation:sp-spin .8s linear infinite;margin:0 auto 14px}
@keyframes sp-spin{to{transform:rotate(360deg)}}
.sp-chal-title{font-size:18px;font-weight:700;margin:0 0 8px;color:#121212}
.sp-chal-sub{font-size:14px;color:#535353;margin:0 0 14px;line-height:1.45}
.sp-chal-inp{width:100%;box-sizing:border-box;border:1px solid #878787;border-radius:4px;padding:12px;font-size:16px;margin:0 0 12px}
.sp-chal-btn{width:100%;background:#1db954;color:#000;border:0;border-radius:500px;padding:12px;font-size:16px;font-weight:700;cursor:pointer}

@media (max-width:520px){
  .field-row{grid-template-columns:1fr}
  .pm-card__brands{display:none}
}

.brand-logo{display:block;height:22px;width:auto;object-fit:contain}
.brand-logo--visa,.brand-logo--mc{height:20px}