/* 动画样式 */

/* 淡入效果 */
@keyframes fadeIn {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: translateY(0); }
  }
  
  /* 旋转动画 */
  @keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
  }
  
  /* 水波纹效果 */
  @keyframes ripple {
	0% {
	  transform: scale(0, 0);
	  opacity: 0.5;
	}
	20% {
	  transform: scale(25, 25);
	  opacity: 0.5;
	}
	100% {
	  opacity: 0;
	  transform: scale(40, 40);
	}
  }
  
  /* 脉冲效果 */
  @keyframes pulse {
	0% { transform: translateX(calc(50% - 40px)) scale(1); }
	50% { transform: translateX(calc(50% - 40px)) scale(1.05); }
	100% { transform: translateX(calc(50% - 40px)) scale(1); }
  }
  
  /* 边框闪烁效果 */
  @keyframes pulseBar {
	0% { opacity: 0.6; }
	50% { opacity: 1; }
	100% { opacity: 0.6; }
  }
  
  /* 页面过渡效果优化 */
  .page-enter {
	opacity: 0;
	transform: translateX(30px);
  }
  
  .page-enter-active {
	opacity: 1;
	transform: translateX(0);
	transition: opacity 0.3s, transform 0.3s;
  }
  
  .page-exit {
	opacity: 1;
	transform: translateX(0);
  }
  
  .page-exit-active {
	opacity: 0;
	transform: translateX(-30px);
	transition: opacity 0.3s, transform 0.3s;
  }