:root{
  --bg1:#0b2a8a; --bg2:#10205a; --card:#ffffff; --muted:#7c8db5;
  --accent:#2f6bff; --accent2:#5aa3ff;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial;
  background: radial-gradient(1200px 600px at 10% -10%, #1939b7 0%, transparent 70%),
              radial-gradient(800px 400px at 120% 0%, #0f1f63 0%, transparent 55%),
              linear-gradient(160deg, var(--bg1), var(--bg2));
  display:grid; place-items:center; padding:24px;
  color:#e8eeff;
}
.auth-wrap{width:100%; max-width:480px}
.brand{
  text-align:center; margin-bottom:18px;
}
.brand .logo{
  width:54px;height:54px;border-radius:12px;
  background:#ffffff22; display:inline-grid; place-items:center;
  backdrop-filter: blur(4px);
}
.brand h1{margin:12px 0 4px;font-size:22px;letter-spacing:.3px;color:#fff}
.brand p{margin:0;color:#b9c6ff;font-size:14px}

.card{
  background:var(--card); color:#0b1b3d;
  border-radius:18px; padding:26px;
  box-shadow:0 12px 30px rgba(0,0,0,.25), inset 0 1px 0 #ffffff;
}
label{display:block; font-size:13px; color:#324b73; margin:12px 0 6px}
.input{
  position:relative
}
.input input{
  width:100%; padding:14px 46px 14px 14px;
  border:1px solid #d9e2f2; border-radius:12px; outline:none;
  font-size:15px; transition:.15s;
  background:#f9fbff;
}
.input input:focus{border-color:var(--accent); background:#fff; box-shadow:0 0 0 3px #2f6bff22}
.eye{
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  width:22px; height:22px; cursor:pointer; opacity:.65;
}
.row{display:flex; justify-content:space-between; align-items:center; gap:10px; margin:8px 0 2px}
.row a{font-size:13px; color:var(--accent); text-decoration:none}
.row a:hover{text-decoration:underline}
.btn{
  width:100%; margin-top:12px; padding:14px 16px; border:0; border-radius:14px;
  background:linear-gradient(135deg, var(--accent), var(--accent2));
  color:#fff; font-weight:600; font-size:16px; cursor:pointer;
  box-shadow:0 8px 20px #2f6bff66; transition:.15s;
}
.btn:hover{transform:translateY(-1px)}
.err{background:#ffe8e8; color:#9a0415; border:1px solid #ffb8b8; padding:10px 12px; border-radius:10px; margin-bottom:10px; font-size:14px}
.remember{display:flex; align-items:center; gap:8px; color:#466092; font-size:13px}
.footer{margin-top:14px; text-align:center; color:#93a7d8; font-size:12px}