@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');
body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #0F1117; color: #f1f5f9; }
.striking-window { background: #1A1D26; border: 1px solid #1e293b; border-radius: 2.5rem; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); }
.news-card-gradient { background: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,0.8) 100%); }
.animate-slide-up { animation: slideUp 0.4s ease-out forwards; }
@keyframes slideUp { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.story-backdrop { backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #334155; border-radius: 10px; }
/* style.css EN ALTINA EKLEYİN */

/* Dikkat Çekme (Titreme) Animasyonu */
@keyframes attention-jiggle {
  0% { transform: rotate(0deg) scale(1); }
  25% { transform: rotate(1deg) scale(1.02); }
  50% { transform: rotate(-1deg) scale(1); }
  75% { transform: rotate(1deg) scale(1.02); }
  100% { transform: rotate(0deg) scale(1); }
}
.animate-attention {
  animation: attention-jiggle 0.4s ease-in-out infinite;
}

/* İpucu Banner'ı (Yukarıdan inip kaybolma) */
@keyframes fade-in-out {
  0% { opacity: 0; transform: translate(-50%, 10px); }
  15% { opacity: 1; transform: translate(-50%, 0); }
  85% { opacity: 1; transform: translate(-50%, 0); }
  100% { opacity: 0; transform: translate(-50%, -10px); }
}
.animate-hint {
  animation: fade-in-out 5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

/* Sayı Toplarının Yüzme Efekti */
@keyframes sphere-float {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-5px) scale(1.05); }
}
.animate-sphere-float {
  animation: sphere-float 2.5s ease-in-out infinite;
}

/* Başlık Animasyonu */
@keyframes tracking-in-expand {
  0% { letter-spacing: -0.5em; opacity: 0; }
  40% { opacity: 0.6; }
  100% { opacity: 1; }
}
.animate-title {
  animation: tracking-in-expand 0.7s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
}

/* React'teki özel gölge ve buton stilleri */
.btn-bounce:active { transform: scale(0.96); }