:root{
  --thp-bg:#ffffff; --thp-text:#0f172a; --thp-muted:#64748b; --thp-border:#e2e8f0;
  --thp-primary:#1d4ed8; --thp-primary-strong:#1e40af; --thp-ok:#16a34a; --thp-warn:#dc2626;
}
.thp-upgrade-container{max-width:640px;margin:48px auto;padding:0 16px;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,system-ui,sans-serif;color:var(--thp-text);}
.thp-progress-steps{display:flex;align-items:center;gap:12px;margin:8px 0 20px;}
.thp-step{flex:1;display:flex;align-items:center;gap:10px;}
.thp-step-circle{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;
  border:2px solid var(--thp-border);background:#fff;color:var(--thp-muted);font-weight:700;}
.thp-step-label{font-size:14px;color:var(--thp-muted);}
.thp-step.active .thp-step-circle{border-color:var(--thp-primary);color:var(--thp-primary);}
.thp-step.completed .thp-step-circle{background:var(--thp-primary);color:#fff;border-color:var(--thp-primary);}
.thp-step.active .thp-step-label{color:var(--thp-text);font-weight:600;}

.thp-upgrade-header{background:#f8fafc;border:1px solid var(--thp-border);border-radius:12px;padding:20px 18px;text-align:center;}
.thp-upgrade-header h2{margin:0 0 6px;font-size:26px;font-weight:700;}
.thp-upgrade-header p{margin:0;color:var(--thp-muted);}

.thp-upgrade-form{position:relative;background:var(--thp-bg);border:1px solid var(--thp-border);
  border-radius:12px;padding:20px;margin-top:16px;box-shadow:0 2px 8px rgba(15,23,42,.04);}
.thp-form-row{margin-bottom:16px;}
.thp-upgrade-form label{display:block;margin:0 0 6px;font-weight:600;font-size:14px;color:var(--thp-text);}
.thp-required{color:var(--thp-warn);}
.thp-input{width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid var(--thp-border);
  border-radius:10px;background:#fff;font-size:16px;line-height:1.35;transition:border-color .15s,box-shadow .15s;}
.thp-input:focus{outline:none;border-color:var(--thp-primary);box-shadow:0 0 0 3px rgba(29,78,216,.12);}
.thp-form-row.has-error .thp-input{border-color:var(--thp-warn);box-shadow:0 0 0 3px rgba(220,38,38,.10);}
.thp-form-row.has-success .thp-input{border-color:var(--thp-ok);box-shadow:0 0 0 3px rgba(22,163,74,.10);}
.thp-field-hint{font-size:12px;color:var(--thp-muted);margin-top:6px;display:block;}
.thp-error{margin-top:6px;font-size:13px;color:var(--thp-warn);}
.thp-success{margin-top:6px;font-size:13px;color:var(--thp-ok);}
.thp-error-general,.thp-success-message{border-radius:10px;padding:12px 14px;margin:6px 0 14px;font-size:14px;}
.thp-error-general{background:#fef2f2;border:1px solid #fecaca;color:#7f1d1d;}
.thp-success-message{background:#ecfdf5;border:1px solid #bbf7d0;color:#064e3b;}

.thp-info-box{background:#f1f5f9;border:1px solid var(--thp-border);border-radius:10px;padding:12px 14px;margin-bottom:14px;font-size:14px;}

.thp-amount-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:10px;margin-bottom:8px;}
.thp-amount-btn{appearance:none;border:1px solid var(--thp-border);background:#fff;border-radius:999px;
  padding:10px 12px;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s,transform .05s;}
.thp-amount-btn:hover{border-color:var(--thp-primary);background:#f8fafc;}
.thp-amount-btn.selected{background:var(--thp-primary);color:#fff;border-color:var(--thp-primary);}
.thp-custom-amount-wrapper{display:flex;align-items:center;gap:10px;}
.thp-custom-label{color:var(--thp-muted);font-size:14px;}

.thp-submit{width:100%;appearance:none;background:var(--thp-primary);color:#fff;border:0;border-radius:10px;
  padding:14px 18px;font-size:16px;font-weight:700;cursor:pointer;transition:background .15s,transform .05s,box-shadow .15s;
  box-shadow:0 2px 10px rgba(29,78,216,.15);}
.thp-submit:hover{background:var(--thp-primary-strong);}
.thp-submit:active{transform:translateY(1px);}
.thp-submit:disabled{opacity:.6;cursor:not-allowed;box-shadow:none;}

.thp-form-loading::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.6);}
.thp-loading-spinner,.thp-loading-text{display:none;}

.thp-security-note{margin-top:14px;padding-top:12px;border-top:1px solid var(--thp-border);text-align:center;color:var(--thp-muted);font-size:13px;}

.thp-redirect-notice{background:#ecfdf5;border:1px solid #bbf7d0;color:#064e3b;border-radius:12px;padding:20px;text-align:center;}
.thp-redirect-notice h3{margin:0 0 6px;font-size:20px;}

.thp-input:focus-visible,.thp-submit:focus-visible{outline:2px solid var(--thp-primary);outline-offset:2px;}
@media (max-width:480px){
  .thp-upgrade-container{margin:24px auto;}
  .thp-upgrade-form{padding:16px;}
  .thp-upgrade-header h2{font-size:22px;}
}
