html, body { min-height: 100%; height: auto; overflow: auto; }
.login-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 2rem;
}
.login-shell {
  width: min(940px, 100%);
  min-height: 560px;
  display: grid;
  grid-template-columns: minmax(280px, .9fr) minmax(360px, 1.1fr);
  overflow: hidden;
  border: 1px solid rgba(132, 155, 143, .28);
  border-radius: 24px;
  background: rgba(14, 20, 18, .76);
  box-shadow: 0 28px 80px rgba(0,0,0,.46);
  backdrop-filter: blur(20px);
}
.login-portrait {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  background: radial-gradient(circle at 50% 35%, rgba(97, 129, 83, .24), transparent 48%);
}
.login-portrait::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 35%;
  background: linear-gradient(transparent, rgba(10, 14, 13, .78));
}
.login-portrait img { width: 108%; max-height: 560px; object-fit: contain; object-position: center bottom; }
.login-card { padding: clamp(2rem, 5vw, 4.6rem); display: flex; flex-direction: column; justify-content: center; }
.login-brand { display: flex; align-items: center; gap: .9rem; margin-bottom: 3.2rem; }
.login-brand img { filter: drop-shadow(0 0 18px rgba(83, 130, 72, .28)); }
.login-brand h1 { margin: 0; font-size: 1.25rem; letter-spacing: .02em; }
.login-brand p { margin: .2rem 0 0; color: #909b94; font-size: .83rem; font-style: italic; }
.login-copy h2 { margin: 0; font-size: 2rem; }
.login-copy p { color: #929d98; margin: .55rem 0 1.8rem; }
.login-form { display: grid; gap: 1rem; }
.login-form label { display: grid; gap: .42rem; color: #b9c1bd; font-size: .84rem; }
.login-form input { min-height: 46px; }
.login-form button { min-height: 46px; margin-top: .3rem; }
.login-error { padding: .7rem .8rem; border: 1px solid rgba(180, 80, 75, .38); border-radius: 9px; background: rgba(111, 43, 40, .18); color: #e7aaa6; font-size: .82rem; }
.login-status { margin-top: 1.4rem; color: #6f7c76; font-size: .72rem; }
@media (max-width: 720px) {
  .login-body { padding: .7rem; }
  .login-shell { grid-template-columns: 1fr; min-height: auto; }
  .login-portrait { display: none; }
  .login-card { padding: 2rem 1.4rem; }
}
