@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700;800;900&display=swap');

:root {
  --font-primary: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, sans-serif;
  --font-display: 'Outfit', 'Pretendard', sans-serif;
}

body {
  font-family: var(--font-primary);
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.font-display {
  font-family: var(--font-display);
}

/* 부드러운 글래스모피즘 효과 */
.glass-panel {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.6);
}

.dark-glass-panel {
  background: rgba(15, 23, 42, 0.82);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* 흔들림 애니메이션 (오답 시) */
@keyframes shakeAnimation {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-8px); }
  40%, 80% { transform: translateX(8px); }
}
.animate-shake {
  animation: shakeAnimation 0.35s ease-in-out;
}

/* 정답 팝 애니메이션 */
@keyframes popAnimation {
  0% { transform: scale(1); }
  50% { transform: scale(1.08); }
  100% { transform: scale(1); }
}
.animate-pop {
  animation: popAnimation 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* 카운트다운 펄스 애니메이션 */
@keyframes pulseDanger {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.04); opacity: 0.85; filter: drop-shadow(0 0 12px rgba(239, 68, 68, 0.6)); }
}
.animate-danger-pulse {
  animation: pulseDanger 0.8s infinite ease-in-out;
}

/* 콤보 불꽃 튀는 애니메이션 */
@keyframes comboFire {
  0% { transform: scale(0.9) translateY(0); }
  50% { transform: scale(1.15) translateY(-3px); }
  100% { transform: scale(1) translateY(0); }
}
.animate-combo {
  animation: comboFire 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* 시작 카운트다운 전용 */
@keyframes countScale {
  0% { transform: scale(0.3); opacity: 0; }
  50% { transform: scale(1.2); opacity: 1; }
  80% { transform: scale(1); opacity: 1; }
  100% { transform: scale(1.4); opacity: 0; }
}
.animate-countdown-num {
  animation: countScale 0.9s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

/* 가상 키패드 버튼 터치 피드백 */
.numpad-btn {
  transition: all 0.1s cubic-bezier(0.4, 0, 0.2, 1);
}
.numpad-btn:active {
  transform: scale(0.92);
  filter: brightness(0.9);
}

/* 스크롤바 커스텀 */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(156, 163, 175, 0.4);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(156, 163, 175, 0.7);
}

/* 인풋 테두리 포커스 제거 (모바일에서 깔끔하게 유지) */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] {
  -moz-appearance: textfield;
}