*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:28px;background:linear-gradient(130deg,#031624,#12364b);color:#e5edf3;font:16px/1.6 system-ui,sans-serif}main{width:min(100%,460px);padding:32px;border:1px solid #456078;border-radius:20px;background:#082236;box-shadow:0 16px 70px #0006}img{display:block;width:220px;max-width:100%;margin:0 auto 24px;border-radius:12px}h1{font-size:26px;margin:0 0 12px}p{color:#bbcbd8}label{display:block;margin-top:16px}input{width:100%;padding:12px;margin-top:6px;border:1px solid #647c91;border-radius:7px;background:#061725;color:#fff;font:inherit}button{width:100%;margin-top:24px;padding:12px;border:0;border-radius:7px;background:#c38a43;color:#081723;font:700 16px system-ui;cursor:pointer}button:hover{background:#e0aa62}input:focus,button:focus{outline:3px solid #d8ae6c;outline-offset:3px}.note{font-size:13px;margin-bottom:0}[role=alert]{padding:12px;border:1px solid #d8ae6c;border-radius:7px}