:root {
  color-scheme: dark;
  --bg:#071019;
  --panel:#111d29;
  --line:rgba(126,146,168,.25);
  --ink:#eef5ff;
  --soft:#9eabba;
  --cyan:#62b9e8;
  --cyan-deep:#2b6f93;
  --red:#e66c75;
}
* { box-sizing:border-box; }
html, body { min-height:100%; margin:0; }
body {
  min-height:100vh;
  color:var(--ink);
  background:linear-gradient(160deg,#091521,var(--bg) 65%);
  font-family:Inter,system-ui,sans-serif;
}
.auth-shell {
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:28px;
}
.auth-card {
  width:min(100%,430px);
  padding:34px;
  border:1px solid var(--line);
  border-radius:8px;
  background:linear-gradient(180deg,rgba(24,38,53,.97),rgba(13,25,37,.97));
  box-shadow:0 26px 60px rgba(0,0,0,.36);
}
.brand-logo {
  display:block;
  width:172px;
  max-width:70%;
  height:auto;
  margin:0 auto 18px;
}
.eyebrow {
  margin:0;
  color:var(--cyan);
  font-size:12px;
  font-weight:750;
  letter-spacing:.14em;
  text-align:center;
  text-transform:uppercase;
}
h1 {
  margin:11px 0 8px;
  font-size:27px;
  letter-spacing:0;
  text-align:center;
}
.intro, .footnote {
  color:var(--soft);
  font-size:13px;
  line-height:1.55;
  text-align:center;
}
form {
  display:grid;
  gap:15px;
  margin-top:25px;
}
label {
  display:grid;
  gap:7px;
  color:var(--soft);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
input {
  width:100%;
  border:1px solid var(--line);
  border-radius:8px;
  padding:13px 14px;
  outline:none;
  color:var(--ink);
  background:rgba(4,12,19,.7);
  font:inherit;
}
input:focus {
  border-color:var(--cyan);
  box-shadow:0 0 0 3px rgba(98,185,232,.12);
}
button {
  margin-top:4px;
  border:1px solid var(--cyan-deep);
  border-radius:8px;
  padding:13px 16px;
  cursor:pointer;
  color:#06111a;
  background:linear-gradient(180deg,#77c9f3,#55addc);
  font:inherit;
  font-weight:800;
}
button:disabled {
  cursor:wait;
  opacity:.7;
}
.status {
  min-height:18px;
  margin:0;
  color:var(--red);
  font-size:12px;
}
.footnote {
  margin:24px 0 0;
  font-size:11px;
}
