/* 로그인 화면 전용 — 공용 컴포넌트(.card·.field·.btn)는 base.css가 담당 */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
.login-card { width: 100%; max-width: 22rem; }
.login-title { margin: 0 0 1.25rem; font-size: 1.375rem; text-align: center; }
.login-forgot { margin: .9rem 0 0; text-align: center; font-size: .875rem; }

/* 구글 로그인 단추 — 카드 폭에 맞춰 form 아래에 붙는다 */
.sso { margin-top: 1.25rem; }
.sso-or { display: flex; align-items: center; gap: .75rem;
  color: var(--ink-soft); font-size: .8125rem; margin-bottom: .875rem; }
.sso-or::before, .sso-or::after { content: ""; flex: 1; height: 1px; background: var(--rule); }
.sso-btn { display: flex; align-items: center; justify-content: center; gap: .625rem;
  width: 100%; min-height: var(--tap-min); padding: .625rem 1rem;
  background: var(--surface); color: var(--ink); font: inherit; font-weight: 600;
  border: 1px solid var(--rule); border-radius: var(--radius);
  text-decoration: none; }
.sso-btn:hover { background: var(--bg); }
.sso-btn svg { flex: none; }