@font-face{font-family:'Gilroy-SemiBold';src:url('https://copella.live/assets/fonts/Gilroy-SemiBold.woff') format('woff');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Gilroy-Bold';src:url('https://copella.live/assets/fonts/Gilroy-Bold.woff') format('woff');font-weight:700;font-style:normal;font-display:swap}

.cp-support{--sp-bg:#171717;--sp-radius:32px;color:#fff}
.cp-support{position:relative;border-radius:var(--sp-radius);background:var(--sp-bg);padding:20px;overflow:hidden;font-family:'Gilroy-SemiBold',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
.cp-support::before{content:"";position:absolute;inset:-20%;filter:blur(40px);opacity:.55;z-index:0;pointer-events:none;background:
  radial-gradient(280px 220px at 20% 20%, rgba(255,153,0,.35), transparent 60%),
  radial-gradient(260px 200px at 70% 30%, rgba(210,90,0,.30), transparent 60%),
  radial-gradient(300px 240px at 40% 80%, rgba(255,196,0,.25), transparent 60%),
  linear-gradient(180deg, rgba(0,0,0,.2), rgba(0,0,0,.2));
}
.cp-support .sp-inner{position:relative;z-index:1}

.cp-support .sp-title{margin:0 0 14px 0;font-weight:800;font-size:clamp(22px,2.4vw,32px);line-height:1.1;font-family:'Gilroy-Bold','Gilroy-SemiBold',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
.cp-support .sp-title .cp-pill{display:inline-block;background:#ff8a00;color:#000;border-radius:12px;padding:2px 8px;margin:0 4px}

.cp-support .sp-details{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.cp-support .sp-item{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:10px 12px}
.cp-support .sp-flag{display:inline-block;width:34px;height:24px;border-radius:6px;flex:0 0 auto}
.cp-support .sp-flag--mir{background:linear-gradient(90deg,#03B77B,#00A36C)}
.cp-support .sp-flag--ym{background:linear-gradient(90deg,#6F2CFF,#8E5CFF)}
.cp-support .sp-text{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cp-support .sp-copy{appearance:none;background:transparent;border:0;color:#fff;width:28px;height:28px;display:inline-grid;place-items:center;border-radius:8px;cursor:pointer}
.cp-support .sp-copy:hover{background:rgba(255,255,255,.08)}
.cp-support .sp-copy:active{transform:translateY(1px)}

.cp-support .sp-actions{margin-top:6px;display:flex;gap:8px;flex-wrap:wrap}
.cp-support .sp-button{display:inline-block;background:linear-gradient(90deg,#ff8a00,#ff3d00);color:#000;font-weight:800;text-decoration:none;border-radius:12px;padding:10px 14px}
.cp-support .sp-button--ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.18)}

.cp-support .sp-progress{display:grid;gap:8px}
.cp-support .sp-progress__track{background:rgba(255,255,255,.08);border-radius:999px;overflow:hidden}
.cp-support .sp-progress__bar{position:relative;height:16px;background:linear-gradient(90deg,#ff9800 0%, #ff6d00 100%);width:0%;border-radius:999px;overflow:hidden}
.cp-support .sp-progress__bar::before{content:"";position:absolute;inset:-25%;background:
  radial-gradient(80px 80px at center, rgba(255,200,120,.40), transparent 60%),
  radial-gradient(70px 70px at center, rgba(255,160,80,.35), transparent 60%),
  radial-gradient(90px 90px at center, rgba(255,120,60,.30), transparent 60%);
background-repeat:no-repeat;background-size:180% 180%,160% 160%,200% 200%;background-position:0% 0%,100% 20%,20% 100%;filter:blur(12px);opacity:.9;mix-blend-mode:screen;pointer-events:none;animation:spBlobs 9s ease-in-out infinite alternate}
@keyframes spBlobs{0%{background-position:0% 0%,100% 20%,20% 100%}50%{background-position:60% 40%,30% 80%,80% 30%}100%{background-position:100% 100%,0% 80%,100% 0%}}
@media (prefers-reduced-motion: reduce){.cp-support .sp-progress__bar::before{animation:none}}
.cp-support .sp-progress__label{font-size:14px;opacity:.95}
/* Infinite mode */
.cp-support.cp-support--infinite .sp-progress__track{background:rgba(255,255,255,.10)}
.cp-support.cp-support--infinite .sp-progress__bar{background:linear-gradient(90deg,rgba(255,255,255,.25) 0%, rgba(255,255,255,.5) 50%, rgba(255,255,255,.25) 100%)}
.cp-support.cp-support--infinite .sp-progress__bar--indeterminate{position:relative}
.cp-support.cp-support--infinite .sp-progress__bar--indeterminate::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,255,255,.18) 0, rgba(255,255,255,.18) 12px, rgba(255,255,255,.06) 12px, rgba(255,255,255,.06) 24px);animation:spStripes 1.2s linear infinite}
@keyframes spStripes{from{background-position:0 0}to{background-position:48px 0}}

/* Themes for infinite mode */
.cp-support.cp-support--infinite.cp-support--theme-red{--sp-bg:#2a0e0e}
.cp-support.cp-support--infinite.cp-support--theme-green{--sp-bg:#0e2a16}

@media (max-width: 640px){
  .cp-support{border-radius:20px;padding:16px;margin-left:12px;margin-right:12px}
}
@media (max-width: 1024px) and (min-width: 641px){
  .cp-support{margin-left:16px;margin-right:16px}
}