:root { --ink:#14233a; --muted:#6c7889; --teal:#087e72; --line:#dfe4ea; }
* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100dvh;
  color: var(--ink);
  background:
    radial-gradient(circle at 18% 8%, rgba(8,126,114,.12), transparent 28rem),
    #f2f5f7;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}
.login-shell { min-height: 100dvh; display: grid; place-items: center; padding: 24px; }
.login-card { width: min(100%, 420px); padding: 38px; background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 24px 70px rgba(20,35,58,.12); }
.mark { width: 46px; height: 46px; display: grid; place-items: center; color: #fff; background: #172942; border-radius: 12px; font-size: 20px; font-weight: 800; }
.eyebrow { margin: 28px 0 8px; color: var(--teal); font-size: 11px; font-weight: 800; letter-spacing: .15em; }
h1 { margin: 0; font-size: 30px; letter-spacing: -.035em; }
.description { margin: 10px 0 28px; color: var(--muted); font-size: 14px; }
label { display: block; margin-top: 16px; }
label span { display: block; margin-bottom: 7px; font-size: 12px; font-weight: 700; }
input { width: 100%; height: 46px; padding: 0 13px; color: var(--ink); background: #fbfcfd; border: 1px solid var(--line); border-radius: 9px; outline: none; font: inherit; }
input:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(8,126,114,.12); }
.error { min-height: 19px; margin: 10px 0 2px; color: #b13a3a; font-size: 12px; }
button { width: 100%; height: 46px; border: 0; border-radius: 9px; color: #fff; background: var(--teal); cursor: pointer; font: inherit; font-weight: 750; }
button:disabled { opacity: .65; cursor: wait; }
@media (max-width: 520px) { .login-card { padding: 28px 22px; } }