body{background-color:#333;background-image:url(bg1.webp);background-size:cover;justify-content:center;align-items:center;height:100vh;margin:0;padding:0;font-family:system-ui,sans-serif;display:flex}.container{background:#d4e3fa;border-radius:8px;padding:4em;box-shadow:0 3px 6px #00000029,0 3px 6px #0000003b}h1{text-align:center}label{margin:15px 0 5px;display:block}input[type=number]{color:#fff;background-color:#5473d6;border:0;border-radius:5px;width:94%;padding:1em}button{color:#fff;cursor:pointer;background-color:#bf17b6;border:0;border-radius:5px;width:100%;margin-top:2em;padding:1em 2em;font-size:1em;font-weight:700;transition:all .3s}button:hover{background-color:#0056b3}.result{text-align:center;margin-top:20px;font-size:1.2em;font-weight:700}.result svg,.result img{width:100px;height:100px;margin:0 auto;display:block}