: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:
    radial-gradient(circle at 50% -10%,rgba(43,111,147,.28),transparent 34rem),
    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:18px;
  background:linear-gradient(180deg,rgba(24,38,53,.97),rgba(13,25,37,.97));
  box-shadow:0 26px 60px rgba(0,0,0,.36);
}
.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:-.03em; 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; }