:root{
  --bg:#0f141b;
  --card:#161d27;
  --line:#253041;
  --text:#e5ecf5;
  --muted:#99a8bc;
  --primary:#3b82f6;
  --primary-hover:#2563eb;
  --danger:#ef4444;
  --success:#22c55e;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  background:linear-gradient(180deg,#0b1016 0%,#111827 100%);
  color:var(--text);
}

.app{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px}
.app-content{width:100%}
.app-content-body{max-width:560px;margin:0 auto}
.container{width:100%}
.row{display:flex;justify-content:center}
.justify-content-center{justify-content:center}
.col-sm-5{width:100%;max-width:520px}

.text-center{text-align:center}
.mb-4{margin-bottom:1rem}
.mb-3{margin-bottom:.9rem}
.mb-0{margin-bottom:0}
.mt-2{margin-top:.5rem}

.app-nav-logo{font-weight:700;font-size:32px;letter-spacing:.2px}
.app-nav-logo--dark{color:#fff}
.text-muted{color:#b2bfd1}

.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:0 20px 40px rgba(0,0,0,.35);
  overflow:hidden;
}
.card-header{
  padding:14px 18px;
  border-bottom:1px solid var(--line);
  font-weight:600;
}
.card-body{padding:18px}

.form-label,.col-form-label{
  display:block;
  margin-bottom:6px;
  color:var(--muted);
  font-size:14px;
}

.form-control{
  width:100%;
  border:1px solid #324054;
  background:#0f1621;
  color:var(--text);
  border-radius:10px;
  padding:10px 12px;
  font-size:15px;
  outline:none;
  transition:border-color .15s,box-shadow .15s;
}
.form-control:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(59,130,246,.2);
}

.btn{
  display:inline-block;
  border:0;
  border-radius:999px;
  padding:10px 18px;
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
}
.btn-primary{
  background:var(--primary);
  color:#fff;
}
.btn-primary:hover{background:var(--primary-hover)}

.text-primary{color:#8ab6ff}
.text-success{color:#7ee5a3}
a.text-primary{color:#8ab6ff;text-decoration:none}
a.text-primary:hover{text-decoration:underline}

.offset-md-4{margin-left:0}

.alert{
  padding:10px 12px;
  border-radius:10px;
  margin-bottom:12px;
  font-size:14px;
}
.alert-danger{background:rgba(239,68,68,.14);border:1px solid rgba(239,68,68,.35);color:#ffc3c3}
.alert-success{background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.35);color:#b7ffd0}