/* Login page */
.login-page { min-height: 100vh; display: flex; flex-direction: column; }
.login-main { flex: 1; padding: 3.5rem 0 4.5rem; }
.login-grid { display: grid; grid-template-columns: minmax(0, 440px) minmax(0, 1fr); gap: 3.5rem; align-items: start; }
.login-card { background: var(--surface); border: 1px solid var(--line); border-top: 3px solid var(--seal); border-radius: var(--r-md); padding: 2rem 2rem 1.5rem; }
.login-card h1 { font-size: var(--fs-xl); }
.login-sub { color: var(--muted); margin: 0.5rem 0 1.75rem; }
#login-form { display: grid; gap: 0.6rem; }
.code-row { display: grid; grid-template-columns: 1fr auto; gap: 0.5rem; }
.code-row .btn { min-width: 8.5rem; font-weight: 500; }
.btn-block { width: 100%; margin-top: 0.75rem; }
.form-error { text-align: center; }
.login-aside { padding-top: 1rem; color: var(--muted); }
.login-aside h2 { font-size: var(--fs-md); margin-bottom: 0.75rem; }
.login-aside ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 0.6rem; }
.login-aside li { padding-left: 1.1rem; position: relative; }
.login-aside li::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 6px; height: 6px; background: var(--seal); border-radius: 1px; }
@media (max-width: 820px) {
  .login-grid { grid-template-columns: 1fr; gap: 2rem; }
  .login-card { padding: 1.5rem 1.25rem 1.25rem; }
}