*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;background:#eef3ef;color:#20382e;font:16px system-ui}main{width:min(480px,calc(100% - 32px));background:white;padding:32px;border-radius:18px;margin:24px auto}h1{font:700 28px Georgia}label{display:block;margin:18px 0 6px}input{width:100%;padding:12px;border:1px solid #718278;border-radius:6px;font:inherit}button{width:100%;padding:12px;background:#164c3c;color:white;border:0;border-radius:6px;font:inherit;margin:24px 0;cursor:pointer}a{color:#1558a6}[role=alert]{color:#8d2222}@media(max-width:520px){main{padding:22px}h1{font-size:25px}}