/* Pulse Nexus login page */
* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
}

body {
  min-height: 100vh;
  margin: 0;
  background: radial-gradient(circle at 50% -10%, #17263c 0, #0a111c 40%, #060a10 76%);
  color: #ffffff;
  font-family: Arial, Helvetica, sans-serif;
}

.auth-page { min-height:100vh; display:flex; flex-direction:column; }
.auth-banner { width:100%; background:#080d14; border-bottom:1px solid #20334c; box-shadow:0 16px 50px #0008; }
.auth-banner .djlc-site-banner-frame { border-radius:0 !important; max-height:330px; }
.auth-shell { flex:1; display:grid; place-items:center; padding:42px 20px 56px; }

.login-card {
  position:relative;
  width:min(480px,100%);
  padding:34px;
  border:1px solid #2b405d;
  border-radius:22px;
  background:linear-gradient(155deg,#111c2b 0,#0b121d 72%);
  box-shadow:0 24px 80px #0009,0 0 40px #446da817;
  overflow:hidden;
}
.login-card::before { content:""; position:absolute; inset:0 0 auto; height:2px; background:linear-gradient(90deg,transparent,#7eb5ff,#8f72ff,transparent); }
.brand-kicker { font-size:11px; font-weight:900; letter-spacing:.2em; text-transform:uppercase; color:#82aee8; }

h1 {
  margin:
    0 0 8px;
}

.subtitle {
  margin:
    0 0 26px;

  color: #999;
}

label {
  display: block;

  margin:
    18px 0 7px;

  color: #bbb;

  font-size: 14px;
}

input {
  width: 100%;

  padding: 13px 14px;

  border:
    1px solid #3a3a3a;

  border-radius: 10px;

  background: #111;
  color: #fff;

  font-size: 16px;
}

button {
  width: 100%;

  margin-top: 24px;

  padding: 13px 18px;

  border: 0;

  border-radius: 10px;

  background: #fff;
  color: #111;

  font-weight: bold;

  cursor: pointer;
}

.error {
  margin-bottom: 18px;

  padding: 11px 13px;

  border-radius: 10px;

  background: #411;
  color: #fbb;
}

.message {
  margin-bottom: 18px;
  padding: 11px 13px;
  border-radius: 10px;
  background: #16351f;
  color: #c9f7d5;
}
.divider { display:flex; align-items:center; gap:12px; margin:22px 0 14px; color:#70839b; font-size:12px; font-weight:800; }
.divider::before,.divider::after { content:""; height:1px; flex:1; background:#293b51; }
.social { display:grid; grid-template-columns:1fr 1fr; gap:11px; }
.social a { display:flex; align-items:center; justify-content:center; gap:9px; min-height:46px; padding:11px; border:1px solid #30445f; border-radius:11px; background:#101a28; color:#fff; text-decoration:none; font-weight:800; transition:.18s; }
.social a:hover { transform:translateY(-1px); border-color:#668fc4; background:#152237; }
.social-mark { display:grid; place-items:center; width:24px; height:24px; border-radius:7px; font-weight:900; }
.google .social-mark { background:#fff; color:#4285f4; }
.facebook .social-mark { background:#1877f2; color:#fff; }
.auth-links { display:flex; justify-content:space-between; gap:16px; margin-top:21px; }
.auth-links .back { margin-top:0; font-size:14px; color:#8fa9c8; }
.secure-note { text-align:center; margin:23px 0 0; color:#62758d; font-size:12px; }

.back {
  display: block;

  margin-top: 22px;

  text-align: center;

  color: #999;

  text-decoration: none;
}

.back:hover { color:#fff; }
@media(max-width:620px){.auth-shell{padding:24px 14px 36px}.login-card{padding:25px 20px;border-radius:18px}.social{grid-template-columns:1fr}.auth-links{flex-direction:column;align-items:center;gap:12px}.auth-banner .djlc-site-banner-frame{max-height:none}}
