*{text-align:center;font-family:system-ui;margin:0;padding:0}header{background-color:#74a4bc;padding:30px 20px;display:flex;justify-content:space-between;align-items:center;width:100%;box-sizing:border-box}dialog{display:none;position:fixed;transform:translate(43.5vw,30vh);background-color:#fff;padding:20px;border:1px solid #ccc;z-index:1000}dialog[open]{display:block}input{border-radius:8px;border:solid #74A4BC 2px;background-color:#fff;padding:5px;color:#000;transition:border-color 2.5s ease;transition:color .5s ease;transition:background-color .5s ease;margin-bottom:10px}input:hover,input:focus{color:#fff;border-color:#74a4bc;background-color:#000}button{border-radius:999px;border:solid #74A4BC 2px;background-color:#fff;padding:10px;color:#000;transition:color .5s ease;transition:background-color .5s ease}button:hover{color:#fff;background-color:#000;cursor:pointer}