*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html,body{height:100%}
body{font-family:Arial,Helvetica,sans-serif;overflow:hidden;color:#fff}
.bg{position:fixed;inset:0;background:url('../assets/base.png') center/cover no-repeat;z-index:-1}
.container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;padding:20px}
.form-box{background:rgba(0,0,0,.28);backdrop-filter:blur(8px);padding:30px;border-radius:24px;width:90%;max-width:420px;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.form-box h2{margin-bottom:18px;text-align:center;color:#fff}
input{width:100%;padding:14px 16px;margin-bottom:14px;border-radius:14px;border:none;background:#fff;color:#000;font-size:16px}
button{width:100%;padding:15px;border:none;border-radius:14px;background:#52B436;color:#fff;font-size:17px;font-weight:700;cursor:pointer;transition:transform .18s ease,opacity .18s ease}
button:hover{transform:scale(1.02)}
button:disabled{opacity:.7;cursor:wait}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.62);display:flex;justify-content:center;align-items:center;padding:20px;z-index:30}
.modal{background:#fff;color:#111;padding:24px 20px;border-radius:22px;text-align:center;width:min(92vw,380px);box-shadow:0 25px 80px rgba(0,0,0,.35)}
.modal h3{margin-bottom:10px}
.modal p{margin-bottom:16px;font-size:16px}
.success-overlay{position:fixed;inset:0;display:grid;place-items:center;background:rgba(7,38,8,.38);backdrop-filter:blur(6px);z-index:50}
.success-wrap{text-align:center;animation:fadeIn .25s ease}
.success-circle{width:min(42vw,190px);height:min(42vw,190px);max-width:190px;max-height:190px;border-radius:999px;background:radial-gradient(circle at 35% 30%, #9cff7b 0%, #52B436 45%, #2f8b1f 100%);display:grid;place-items:center;box-shadow:0 0 0 0 rgba(82,180,54,.55),0 0 50px rgba(82,180,54,.55),0 0 110px rgba(82,180,54,.35);animation:popCheck .62s cubic-bezier(.2,.9,.2,1.15), pulseGlow 1.2s ease-in-out .62s infinite}
.checkmark{font-size:min(24vw,108px);line-height:1;color:#fff;font-weight:900;transform:scale(.2);animation:checkIn .35s ease .22s forwards}
.success-text{margin-top:20px;font-size:clamp(22px,4vw,34px);font-weight:800;color:#fff;text-shadow:0 6px 24px rgba(0,0,0,.28)}
.success-sub{margin-top:8px;font-size:clamp(14px,2.5vw,18px);color:#fff}
@keyframes popCheck{
  0%{transform:scale(.15);opacity:0}
  60%{transform:scale(1.14);opacity:1}
  100%{transform:scale(1)}
}
@keyframes checkIn{
  from{transform:scale(.2) rotate(-18deg);opacity:0}
  to{transform:scale(1) rotate(0);opacity:1}
}
@keyframes pulseGlow{
  0%,100%{box-shadow:0 0 0 0 rgba(82,180,54,.55),0 0 50px rgba(82,180,54,.55),0 0 110px rgba(82,180,54,.35)}
  50%{box-shadow:0 0 0 18px rgba(82,180,54,0),0 0 65px rgba(135,255,116,.75),0 0 130px rgba(82,180,54,.45)}
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}