.inputBox{transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.inputBox.default{border-color:#ffffff4d;background:#ffffff1a;transform:scale(1)}.inputBox.active{border-color:#60a5fa;background:#60a5fa26;transform:scale(1.05) translateY(-2px);box-shadow:0 8px 25px #60a5fa4d}.inputBox.correct{border-color:#34d399;background:#34d39926;transform:scale(1.02);box-shadow:0 4px 20px #34d39966}.inputBox.incorrect{border-color:#f87171;background:#f8717126;animation:shake .5s ease-in-out;box-shadow:0 4px 20px #f8717166}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.inputBox.correct:before{content:"";position:absolute;top:50%;left:50%;width:8px;height:8px;background:#34d399;border-radius:50%;transform:translate(-50%,-50%) scale(0);animation:successPulse .6s ease-out}@keyframes successPulse{0%{transform:translate(-50%,-50%) scale(0);opacity:1}50%{transform:translate(-50%,-50%) scale(3);opacity:.8}to{transform:translate(-50%,-50%) scale(6);opacity:0}}.inputBox.incorrect:before{content:"";position:absolute;top:50%;left:50%;width:8px;height:8px;background:#f87171;border-radius:50%;transform:translate(-50%,-50%) scale(0);animation:errorPulse .6s ease-out}@keyframes errorPulse{0%{transform:translate(-50%,-50%) scale(0);opacity:1}50%{transform:translate(-50%,-50%) scale(3);opacity:.8}to{transform:translate(-50%,-50%) scale(6);opacity:0}}.cat-progress{transition:all .4s cubic-bezier(.4,0,.2,1);filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.cat-happy{animation:bounce .6s ease-in-out}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}.progress-bar{transition:all .4s ease-in-out;border-radius:2px;transform-origin:left;transform:scaleX(0)}.status-message{transition:all .3s ease-in-out;opacity:0;transform:translateY(10px)}.status-message.show{opacity:1;transform:translateY(0)}.verification-success{animation:successGlow 1s ease-in-out}@keyframes successGlow{0%{box-shadow:0 0 #34d399b3}50%{box-shadow:0 0 0 20px #34d39900}to{box-shadow:0 0 #34d39900}}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}
