:root {
  color-scheme: light;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #213c42;
  background: #eef4f3;
  font-synthesis: none;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 28px 20px;
  background: radial-gradient(ellipse at 20% 15%, #dbece7 0, transparent 55%), #eef4f3;
}
.login-card {
  width: 100%;
  max-width: 408px;
  padding: 40px 36px 28px;
  background: #fff;
  border: 1px solid #dce7e3;
  border-radius: 22px;
  box-shadow: 0 20px 60px #254b4010;
}
.login-mark {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-bottom: 26px;
  border-radius: 14px;
  color: #287463;
  background: #eaf4ef;
}
.login-mark svg { width: 32px; height: 32px; }
.eyebrow { margin: 0 0 9px; color: #58766c; font-size: 12px; letter-spacing: 2px; }
h1 { margin: 0; font-size: 26px; font-weight: 650; letter-spacing: -.5px; }
.intro { margin: 12px 0 30px; color: #6b7e7b; font-size: 14px; line-height: 1.7; }
label { display: block; margin-bottom: 9px; font-size: 14px; font-weight: 600; }
input {
  width: 100%;
  min-height: 48px;
  padding: 11px 13px;
  border: 1px solid #c5d6d0;
  border-radius: 9px;
  background: #fbfdfc;
  color: inherit;
  font: inherit;
  font-size: 16px;
}
input:focus-visible, button:focus-visible { outline: 3px solid #8fcbb8; outline-offset: 3px; }
input:focus { border-color: #357c69; }
.login-error { min-height: 22px; margin: 9px 0 13px; color: #a33838; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
button {
  width: 100%;
  min-height: 48px;
  border: 0;
  border-radius: 9px;
  background: #287463;
  color: #fff;
  font: inherit;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}
button:hover:not(:disabled) { background: #205e50; }
button:disabled { opacity: .7; cursor: wait; }
.privacy-note { margin: 25px 0 0; text-align: center; font-size: 12px; color: #74857f; }
@media (max-width: 420px) {
  .login-card { padding: 30px 24px 24px; }
}
