body{font-size:18px;margin:5px}#convert-container{width:100%;max-width:400px;margin-top:10px;padding:20px 10px;border:#4f46e5 solid 2px;border-radius:4px;box-sizing:border-box}label{display:block;font:18px Fira Sans,sans-serif}input,label{margin:5px 0}input{width:100%;max-width:400px;padding:10px 14px;font-size:18px;border:2px solid #ddd;border-radius:12px;outline:none;transition:.2s;box-sizing:border-box}input:focus{border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e533}.required-star{color:red;margin-left:4px}.visually-hidden{display:inline-block;width:1px;height:1px;margin:0;padding:0;overflow:hidden;white-space:nowrap;border:0;vertical-align:bottom}button{padding:.75em 1.5em;border-radius:8px;border:2px solid #AD325E;color:#ad325e;outline:2px solid #AD325E;outline-offset:-2px;transition:outline-offset .2s ease}button:hover,button:focus{outline:2px solid #AD325E;outline-offset:-6px}#convert{--clr: #5559AB;--outline: 2px solid white;padding:.75em 1.5em;border-radius:8px;border:2px solid var(--clr);background-color:var(--clr);color:#fff;outline:var(--outline);transition:outline-offset .2s ease;position:relative;display:block;float:right}#convert:hover,#convert:focus{outline:var(--outline);outline-offset:-6px}