*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:#eef1f5;color:#323C52;min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}
.header{background:#eef1f5;padding:40px 24px 32px;text-align:center}
.header img{width:180px;height:auto}
.header .accent{height:3px;background:#323C52;margin:20px auto 0;max-width:440px}
main{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:20px 20px 40px}
.card{background:#fff;border:1px solid #e5e9ef;border-radius:12px;padding:36px 40px;max-width:440px;width:100%;box-shadow:0 1px 2px rgba(20,30,50,.04)}
.card h1{font-size:20px;font-weight:600;color:#323C52;margin-bottom:6px;text-align:center}
.card .subtitle{font-size:13px;color:#5b6577;margin-bottom:28px;text-align:center;line-height:1.6}
.step{display:none}
.step.active{display:block}
.field{margin-bottom:18px}
.field label{display:block;font-size:13px;font-weight:500;color:#5b6577;margin-bottom:6px}
.field input[type=email],.field input[type=text]{width:100%;padding:12px 14px;border:1px solid #dce1e8;border-radius:9px;font-size:14px;font-family:inherit;color:#323C52;-webkit-appearance:none;transition:border-color .15s,box-shadow .15s}
.field input[type=email]:focus,.field input[type=text]:focus{border-color:#323C52;outline:none;box-shadow:0 0 0 3px rgba(50,60,82,.10)}
#code-input{letter-spacing:8px;font-family:Menlo,Monaco,Consolas,monospace;font-size:20px;font-weight:600;text-align:center;padding:14px}
.btn{display:block;width:100%;padding:14px;border:none;border-radius:9px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;background:#323C52;color:#fff;margin-top:8px;transition:background .15s,transform .05s}
.btn:hover{background:#5b6577}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.secondary{background:transparent;color:#5b6577;border:1px solid #dce1e8}
.btn.secondary:hover{background:#f4f6f8}
.msg{font-size:13px;padding:12px 14px;border-radius:9px;margin-top:14px;line-height:1.5;display:none}
.msg.info{background:#F5F6F8;border:1px solid #E6E9EF;color:#5A626F;display:block}
.msg.error{background:#FDEDEC;border:1px solid #F5C6C1;color:#C0392B;display:block}
.msg.success{background:#E9F7EF;border:1px solid #A9E0C2;color:#0F8A4F;display:block}
.hint{font-size:11px;color:#7a8499;margin-top:8px;line-height:1.5;text-align:center}
.footer{text-align:center;padding:24px 20px;font-size:11px;color:#7a8499;line-height:1.8}
.footer a{color:#5A626F;text-decoration:none}
.footer a:hover{color:#323C52}
@media(max-width:500px){.card{padding:28px 24px}.header{padding:32px 20px 24px}.header img{width:140px}.card h1{font-size:18px}}