/* ═══════════════════════════════════════════════════════════
   Login Page — 登录页布局
   ═══════════════════════════════════════════════════════════ */

.brand-icon { width: 20px; height: 20px; color: var(--accent); }

.login-page {
  min-height: 100vh; display: grid; place-items: center;
  padding: 32px;
  background:
    radial-gradient(ellipse 80% 50% at 50% -20%, rgba(59,130,246,0.08), transparent),
    var(--bg);
}

.login-shell {
  display: grid; grid-template-columns: 1fr 400px;
  align-items: center; gap: 64px;
  width: min(960px, 100%);
}

.login-copy { display: grid; gap: 28px; padding: 12px; }

.login-copy .brand { border-bottom: 0; padding: 0; margin: 0; }

.login-copy .brand-mark { width: 44px; height: 44px; font-size: 0.9rem; }

.login-copy h1 { font-size: 2rem; max-width: 420px; line-height: 1.2; }

.login-copy p { max-width: 440px; color: var(--fg-secondary); font-size: 0.92rem; line-height: 1.7; }

.login-panel {
  padding: 32px; border: 1px solid var(--border);
  border-radius: var(--radius-xl); background: var(--surface);
  box-shadow: var(--shadow-elevated);
  display: grid; gap: 22px;
}

.login-panel-header { display: grid; gap: 5px; }

.login-form { display: grid; gap: 16px; }

.login-form label { display: grid; gap: 7px; font-weight: 600; font-size: 0.86rem; }

.login-form input { width: 100%; }

.login-form button { width: 100%; height: 44px; }

.login-error {
  padding: 12px 14px; border-radius: var(--radius-sm);
  border: 1px solid rgba(248,113,113,0.2);
  background: var(--danger-dim); color: var(--danger);
  font-weight: 600; font-size: 0.84rem;
}