*,:before,:after{box-sizing:border-box}html,body,#app{height:100%}body{color:#111;-webkit-font-smoothing:antialiased;background:#f2f2f3;margin:0;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Inter,system-ui,sans-serif}.app{justify-content:center;align-items:center;min-height:100%;padding:20px;display:flex}.card{background:#fff;border-radius:22px;width:100%;max-width:460px;padding:26px;box-shadow:0 1px 2px #0000000a,0 6px 20px #0000000f}h1{letter-spacing:-.02em;margin:0 0 6px;font-size:26px;font-weight:650}p{color:#6b6b6b;margin:0 0 22px;font-size:14px}.form{gap:16px;display:grid}.label{color:#6a6a6a;gap:6px;font-size:12.5px;font-weight:500;display:grid}.input{background:#fafafa;border:1px solid #e3e3e3;border-radius:14px;outline:none;width:100%;padding:13px 14px;font-size:15px;transition:all .18s}.input::placeholder{color:#b5b5b5}.input:focus{background:#fff;border-color:#111;box-shadow:0 0 0 2px #0000000a}.button{color:#fff;cursor:pointer;background:#111;border:none;border-radius:14px;margin-top:6px;padding:14px;font-size:15px;font-weight:600;transition:all .15s}.button:hover{opacity:.92}.button:active{transform:scale(.98)}.result{background:#fafafa;border:1px solid #eee;border-radius:16px;margin-top:22px;padding:18px}.result h2{color:#8a8a8a;text-transform:uppercase;letter-spacing:.05em;margin:0 0 10px;font-size:13px;font-weight:500}.main{letter-spacing:-.02em;margin-bottom:16px;font-size:28px;font-weight:650}.list{color:#444;gap:8px;font-size:14px;display:grid}@media (width<=480px){.app{align-items:stretch;padding:12px}.card{border-radius:18px;padding:20px}h1,.main{font-size:22px}}