#popup-overlay{
  position:fixed;inset:0;z-index:9500;
  background:rgba(0,0,0,.75);
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  opacity:0;pointer-events:none;
  transition:opacity .4s ease;
}
#popup-overlay.open{opacity:1;pointer-events:all;}
#popup-box{
  background:var(--black);
  border:1px solid rgba(200,241,53,.25);
  border-top:3px solid var(--lime);
  width:100%;max-width:520px;
  padding:40px 44px;
  position:relative;
  transform:translateY(24px) scale(.97);
  transition:transform .4s cubic-bezier(.16,1,.3,1);
}
#popup-overlay.open #popup-box{transform:translateY(0) scale(1);}
#popup-close{
  position:absolute;top:16px;right:18px;
  background:transparent;border:none;
  color:var(--gray3);font-size:1.4rem;line-height:1;
  cursor:none;transition:color .2s;padding:4px 8px;
}
#popup-close:hover{color:var(--lime);}
.popup-label{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--lime);margin-bottom:10px;}
.popup-title{font-family:var(--ff-d);font-size:2.2rem;letter-spacing:.03em;line-height:.95;margin-bottom:8px;}
.popup-sub{font-size:.83rem;color:var(--gray3);line-height:1.65;margin-bottom:24px;}
.popup-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.popup-field{display:flex;flex-direction:column;gap:5px;margin-bottom:12px;}
.popup-field-lbl{font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gray3);}
.popup-input{background:#0a0a0a;border:1px solid var(--border);padding:11px 14px;color:var(--cream);font-family:var(--ff-b);font-size:.88rem;outline:none;width:100%;transition:border-color .25s;border-radius:0;-webkit-appearance:none;}
.popup-input:focus{border-color:var(--lime);background:rgba(200,241,53,.02);}
.popup-input::placeholder{color:var(--gray4);}
.popup-input.popup-shake{animation:popShake .35s ease;}
@keyframes popShake{0%,100%{transform:translateX(0);}20%,60%{transform:translateX(-6px);}40%,80%{transform:translateX(6px);}}
.popup-btn{
  width:100%;background:var(--lime);color:var(--black);border:none;
  padding:14px;font-family:var(--ff-d);font-size:1.2rem;letter-spacing:.08em;
  margin-top:4px;cursor:none;transition:all .25s;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));
}
.popup-btn:hover{background:#a8d020;transform:translateY(-2px);}
.popup-btn:disabled{background:var(--gray4);transform:none;}
.popup-success{
  text-align:center;padding:20px 0;display:none;
}
.popup-success-icon{
  width:60px;height:60px;background:rgba(200,241,53,.1);
  border:2px solid var(--lime);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 16px;
}
.popup-success-title{font-family:var(--ff-d);font-size:1.8rem;letter-spacing:.05em;margin-bottom:8px;}
.popup-success-sub{font-size:.85rem;color:var(--gray3);line-height:1.7;}
.popup-skip{
  text-align:center;margin-top:14px;
  font-size:.72rem;color:var(--gray4);cursor:none;
  transition:color .2s;letter-spacing:.05em;
}
.popup-skip:hover{color:var(--gray3);}
#pop-otp-input::-webkit-inner-spin-button,
#pop-otp-input::-webkit-outer-spin-button{-webkit-appearance:none;}
#pop-otp-input[type=text]{-moz-appearance:textfield;}
@media(max-width:520px){
  #popup-box{padding:28px 24px;}
  .popup-row{grid-template-columns:1fr;}
  .popup-title{font-size:1.8rem;}
}