@keyframes melt {
  0% { transform: translateY(-10px) scaleY(0.8); opacity: 0; }
  50% { transform: translateY(2px) scaleY(1.05); opacity: 1; }
  100% { transform: translateY(0) scaleY(1); opacity: 1; }
}

@keyframes cheeseWheelSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes bounce-cheese {
  0%, 100% { transform: translateY(0) scale(1); }
  30% { transform: translateY(-12px) scale(1.1); }
  50% { transform: translateY(-6px) scale(1.05); }
  70% { transform: translateY(-3px) scale(1.02); }
}

@keyframes confetti-fall {
  0% { transform: translateY(-100vh) rotate(0deg); opacity: 1; }
  100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
}

@keyframes drip {
  0% { transform: scaleY(0); transform-origin: top; }
  60% { transform: scaleY(1.2); transform-origin: top; }
  100% { transform: scaleY(1); transform-origin: top; }
}

@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 5px rgba(255,193,7,0.3); }
  50% { box-shadow: 0 0 25px rgba(255,193,7,0.6); }
}

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

@keyframes wheelSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(var(--spin-deg, 1440deg)); }
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-melt { animation: melt 0.5s ease-out; }
.animate-spin-cheese { animation: cheeseWheelSpin 1s linear infinite; }
.animate-bounce-cheese { animation: bounce-cheese 0.6s ease-out; }
.animate-pulse-glow { animation: pulse-glow 2s ease-in-out infinite; }
.animate-fade-up { animation: fadeUp 0.4s ease-out forwards; }

.shimmer-bg {
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.4) 50%, transparent 100%);
  background-size: 200% 100%;
  animation: shimmer 2s infinite;
}

.cheese-gradient {
  background: linear-gradient(135deg, #FFD54F 0%, #FFA000 50%, #FF8F00 100%);
}

.cheese-text-gradient {
  background: linear-gradient(135deg, #FFD54F, #FF8F00);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.cheese-drip::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  width: 6px;
  height: 10px;
  background: #FFC107;
  border-radius: 0 0 50% 50%;
  animation: drip 2s ease-in-out infinite;
}

.masonry-grid {
  columns: 1;
  column-gap: 16px;
}
@media (min-width: 640px) { .masonry-grid { columns: 2; } }
@media (min-width: 1024px) { .masonry-grid { columns: 3; } }

.masonry-item {
  break-inside: avoid;
  margin-bottom: 16px;
}

.wheel-container {
  position: relative;
  width: 260px;
  height: 260px;
  margin: 0 auto;
}

.wheel-svg {
  transition: transform 4s cubic-bezier(0.17, 0.67, 0.12, 0.99);
}

.tab-active {
  border-bottom: 3px solid #FFC107;
  color: #FF8F00;
}

body.dark .tab-active {
  color: #FFD54F;
}

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: rgba(0,0,0,0.05); border-radius: 4px; }
::-webkit-scrollbar-thumb { background: #FFD54F; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #FFC107; }

.confetti-piece {
  position: fixed;
  width: 12px;
  height: 12px;
  font-size: 16px;
  z-index: 9999;
  pointer-events: none;
  animation: confetti-fall 3s linear forwards;
}