:root {
  --background: #0f172a; /* 다크 모드 배경색 */
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* 글래스모피즘 효과 */
.glass {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

/* 네온 텍스트 효과 */
.neon-text-cyan {
  text-shadow: 0 0 10px rgba(6, 182, 212, 0.5), 0 0 20px rgba(6, 182, 212, 0.3);
}
.neon-text-purple {
  text-shadow: 0 0 10px rgba(168, 85, 247, 0.5), 0 0 20px rgba(168, 85, 247, 0.3);
}

/* 박스 네온 글로우 효과 */
.neon-glow-cyan {
  box-shadow: 0 0 20px rgba(6, 182, 212, 0.3);
}
.neon-glow-purple {
  box-shadow: 0 0 20px rgba(168, 85, 247, 0.3);
}

/* 분석 버튼 그라데이션 */
.gradient-neon {
  background: linear-gradient(135deg, #06b6d4 0%, #3b82f6 100%);
  border: none;
}

/* 로딩 스피너 애니메이션 */
.animate-spin-slow {
  animation: spin 2s linear infinite;
}

/* 텍스트 펄스 애니메이션 */
.animate-pulse-neon {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* 애니메이션 키프레임 */
@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes pulse {
  0%, 100% { opacity: 1; text-shadow: 0 0 15px rgba(6, 182, 212, 0.8); }
  50% { opacity: 0.6; text-shadow: none; }
}

/* 헤더 배경 이미지 */
.hero-bg {
  background-image: url('https://images.unsplash.com/photo-1550751827-4bd374c3f58b?q=80&w=1920&auto=format&fit=crop');
  background-size: cover;
  background-position: center;
  opacity: 0.2;
}

/* 토큰 입력창 포커스 전환 애니메이션 */
#hf-token-input {
  transition: border-color 0.3s ease;
}