body{background-color:#f5f7fa;font-weight:400}h1{font-family:Inter,sans-serif;font-weight:700}.calculator{background:white;border-radius:1.5rem;box-shadow:0 10px 25px rgba(0,0,0,.1);overflow:hidden}.result-item{transition:all .5s ease}.result-item.animate{animation:popIn .6s cubic-bezier(.175,.885,.32,1.275) forwards}.input-field:focus{border-color:#4f46e5;box-shadow:0 0 0 3px rgba(79,70,229,.2)}.calculate-btn{background:linear-gradient(135deg,#4f46e5,#7c3aed);transition:all .3s ease}.calculate-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(79,70,229,.3)}.blob{position:absolute;border-radius:50%;filter:blur(60px);z-index:-1;opacity:.6}@keyframes popIn{0%{opacity:0;transform:scale(.8) translateY(20px)}70%{transform:scale(1.05)}to{opacity:1;transform:scale(1) translateY(0)}}.input-error{animation:shake .4s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-3px,0,0)}40%,60%{transform:translate3d(3px,0,0)}}.error-message{animation:fadeIn .3s ease forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}