/* 회원 로그인·가입 화면 — 공통 auth-card 스타일(components.css) 위에 이 기능만의 부분 */

/* 회원 화면은 초록 계통 — 예전 이름+PIN 화면(파랑)·알파 관문과 한눈에 구분되게 */
#authOverlay {
  --primary: #16a34a;
  --blue: #16a34a;
  --soft: #f6fdf8;
  --line: #cdeed8;
}
#authOverlay .auth-card {
  background: linear-gradient(180deg, #f0fdf4 0, #fff 140px);
}
#authOverlay .auth-header h2 {
  color: #166534;
}
#authOverlay .auth-tab:hover {
  border-color: #86efac;
}
#authOverlay .auth-tab.active {
  box-shadow: 0 8px 20px rgba(22, 163, 74, 0.35);
}
#authOverlay .auth-panel-guide-accent {
  background: #f0fdf4;
  border-color: #bbf7d0;
}
#authOverlay button.primary:hover:not(:disabled) {
  background: #15803d;
}
#authOverlay input:focus {
  outline: 2px solid #86efac;
  outline-offset: 1px;
  border-color: #16a34a;
}

.auth-form label .small {
  font-weight: 400;
}

.password-strength {
  min-height: 1.2em;
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--muted);
}
.password-strength.is-weak { color: #b42318; }
.password-strength.is-medium { color: #b54708; }
.password-strength.is-strong { color: #067647; }

/* 사이드바 사용자 칸 — 이름과 아이디(또는 예전 계정 표시) */
.user-badge-static {
  display: flex;
  flex-direction: column;
  gap: 2px;
}