:root {
  --bg:#0f1117; --surface:#1a1d27; --border:#2e3148;
  --accent:#4f8ef7; --text:#e2e8f0; --muted:#8892a4;
  --red:#f87171; --green:#34d399;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--text);font-family:'Inter',system-ui,sans-serif;
     min-height:100vh;display:flex;align-items:center;justify-content:center;}
.auth-wrap{width:100%;max-width:400px;padding:20px;}
.auth-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:40px 36px;}
.logo{font-size:22px;font-weight:700;margin-bottom:24px;letter-spacing:-.5px;}
.logo span{color:var(--accent);}
h2{font-size:18px;font-weight:600;margin-bottom:6px;}
.sub{color:var(--muted);font-size:13px;margin-bottom:28px;line-height:1.5;}
label{display:block;font-size:12px;font-weight:600;color:var(--muted);
      text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;}
input{width:100%;background:#0a0c12;border:1px solid var(--border);border-radius:8px;
      color:var(--text);font-size:15px;padding:12px 14px;outline:none;
      margin-bottom:18px;font-family:inherit;}
input:focus{border-color:var(--accent);}
input[type=text][inputmode=numeric]{font-size:22px;letter-spacing:8px;text-align:center;}
button[type=submit]{width:100%;background:var(--accent);color:#fff;border:none;
  border-radius:8px;padding:13px;font-size:15px;font-weight:600;cursor:pointer;
  font-family:inherit;transition:background .15s;}
button[type=submit]:hover{background:#3a76e0;}
.error{background:rgba(248,113,113,.1);border:1px solid rgba(248,113,113,.3);
       border-radius:8px;padding:10px 14px;color:var(--red);font-size:13px;margin-bottom:16px;}
.back{display:block;text-align:center;margin-top:20px;color:var(--muted);
      font-size:13px;text-decoration:none;}
.back:hover{color:var(--accent);}
.field{margin-bottom:4px;}