/* Tailwind 自定义工具类 */
@layer utilities {
  /* 背景渐变流动动画 */
  .bg-gradient-animate {
    background: linear-gradient(120deg, #0F172A, #1E293B, #3B82F6, #10B981);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
  }
  /* 按钮发光效果 */
  .btn-glow {
    @apply transition-all duration-300 hover:shadow-lg hover:shadow-secondary/50 hover:-translate-y-1;
  }
  /* 文字渐入动画 */
  .text-fade {
    animation: fadeInUp 1s ease forwards;
  }
  /* 滚动条样式 */
  .log-scroll::-webkit-scrollbar {@apply w-1.5;}
  .log-scroll::-webkit-scrollbar-thumb {@apply bg-secondary/50 rounded-full;}
  .log-scroll::-webkit-scrollbar-track {@apply bg-dark rounded-full;}
  /* 加载动画 */
  .loader-spin {animation: spin 2s linear infinite;}
  .loader-pulse {animation: pulse 2s ease-in-out infinite;}
}

/* 渐变背景动画关键帧 */
@keyframes gradient {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
/* 文字渐入关键帧 */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}
/* 加载动画关键帧 */
@keyframes spin { 100% { transform: rotate(360deg); } }
@keyframes pulse {
  0%, 100% { transform: scale(1); opacity: 0.8; } 50% { transform: scale(1.1); opacity: 1; }
}

/* 粒子画布样式 */
#particles {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}