/* ================================================================
   css/animations.css — EcoBalance
   Барлық @keyframes анимациялар осы жерде
   All @keyframes for the entire game are defined here.
   ================================================================ */

/* Фон бөлшектері / Background particles */
@keyframes float {
    0%, 100% { transform: translateY(100vh) rotate(0deg); opacity: 0; }
    10%       { opacity: 0.6; }
    90%       { opacity: 0.6; }
    100%      { transform: translateY(-100vh) rotate(720deg); opacity: 0; }
}
@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50%       { transform: scale(1.2); }
}

/* Лого иконасы айналу / Logo icon spin */
@keyframes rotate {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* Метрика жолағы жарқылы / Metric bar shimmer */
@keyframes shimmer {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* Оқиға жолы пайда болуы / Event item slide-in */
@keyframes slideIn {
    from { opacity: 0; transform: translateX(-20px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* Жетістік значок пульсі / Badge pulse */
@keyframes badgePulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(251,191,36,0.4); }
    50%       { box-shadow: 0 0 0 10px rgba(251,191,36,0); }
}

/* Өзен ағысы / River flow */
@keyframes riverFlow {
    from { background-position-x: 0; }
    to   { background-position-x: 100px; }
}

/* Балық жүзуі / Fish swimming */
@keyframes fishSwim {
    0%   { bottom: 20%; left: 10%; transform: scaleX(1); }
    40%  { bottom: 60%; left: 80%; transform: scaleX(1); }
    41%  { transform: scaleX(-1); }
    80%  { bottom: 30%; left: 10%; transform: scaleX(-1); }
    81%  { transform: scaleX(1); }
    100% { bottom: 20%; left: 10%; transform: scaleX(1); }
}

/* Жұлдыздар жыпылықтауы / Star twinkle */
@keyframes twinkle {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.2; }
}

/* Күн пульсі / Sun pulse */
@keyframes sunPulse {
    0%, 100% { transform: scale(1); }
    50%       { transform: scale(1.08); }
}

/* Бұлт қалқуы / Cloud drift */
@keyframes drift {
    from { transform: translateX(-150px); }
    to   { transform: translateX(calc(100vw + 150px)); }
}

/* Азаматтар жаяу жүруі / Citizen walking */
@keyframes walk {
    0%   { left: -40px;  transform: scaleX(1); }
    49%  { left: calc(100% + 10px); transform: scaleX(1); }
    50%  { left: calc(100% + 10px); transform: scaleX(-1); }
    99%  { left: -40px;  transform: scaleX(-1); }
    100% { left: -40px;  transform: scaleX(1); }
}
@keyframes walkSlow {
    0%   { left: -40px;  transform: scaleX(1); }
    49%  { left: calc(100% + 10px); transform: scaleX(1); }
    50%  { left: calc(100% + 10px); transform: scaleX(-1); }
    99%  { left: -40px;  transform: scaleX(-1); }
    100% { left: -40px;  transform: scaleX(1); }
}

/* Модал пайда болуы / Modal pop */
@keyframes modalPop {
    from { transform: scale(0.8); opacity: 0; }
    to   { transform: scale(1); opacity: 1; }
}

/* Оқулық қадам анимациясы / Tutorial step pop */
@keyframes tutPop {
    from { opacity: 0; transform: scale(0.9) translateY(10px); }
    to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* Батырма толқыны / Button ripple */
@keyframes rippleGo {
    to { transform: translate(-50%,-50%) scale(4); opacity: 0; }
}

/* Жалқын сан / Float number — pop then rise and fade */
@keyframes floatNumUp {
    0%   { opacity: 0; transform: translateY(0)    scale(0.5); }
    12%  { opacity: 1; transform: translateY(-8px)  scale(1.2); }
    60%  { opacity: 1; transform: translateY(-42px) scale(1); }
    100% { opacity: 0; transform: translateY(-78px) scale(0.85); }
}

/* Жоғары жалқыту (particles) / Float up generic */
@keyframes floatUp {
    to { transform: translateY(-50px); opacity: 0; }
}

/* Стат поп / Stat pop */
@keyframes statPop {
    0%, 100% { transform: scale(1); }
    45%       { transform: scale(1.22); }
}

/* Фактілер таспасы / Facts ticker */
@keyframes tickerRoll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* Панель пайда болуы / Panel entry */
@keyframes panelIn {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Бастау экраны сақина / Start screen glow ring */
@keyframes ringPulse {
    0%, 100% { transform: translate(-50%,-50%) scale(1); opacity: 1; }
    50%       { transform: translate(-50%,-50%) scale(1.05); opacity: 0.5; }
}

/* Бастау экраны лого секіруі / Start screen logo bounce */
@keyframes logoBounce {
    0%, 100% { transform: translateY(0); }
    50%       { transform: translateY(-14px); }
}

/* Ағаш отырғызу ойыны / Tree rush spawn */
@keyframes treeAppear {
    from { transform: scale(0) rotate(-25deg); opacity: 0; }
    to   { transform: scale(1) rotate(0); opacity: 1; }
}

/* Бүлінген күн панелі / Broken solar cell pulse */
@keyframes brokenPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239,68,68,0.3); }
    50%       { box-shadow: 0 0 0 8px rgba(239,68,68,0); }
}

/* Апат хабарламасы / Disaster banner entry */
@keyframes disasterIn {
    from { opacity: 0; transform: translateX(-50%) translateY(-30px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

/* ============ ENHANCED VISUALS ANIMATIONS ============ */

/* Ғимарат пайда болуы / Building rise from ground */
@keyframes buildingRise {
    from { transform: scaleY(0); transform-origin: bottom center; opacity: 0; }
    to   { transform: scaleY(1); transform-origin: bottom center; opacity: 1; }
}

/* Ағаш өсуі / Tree grow bounce */
@keyframes treeGrow {
    0%   { transform: scale(0) translateY(12px); opacity: 0; filter: blur(2px); }
    60%  { transform: scale(1.22) translateY(-5px); opacity: 1; filter: blur(0); }
    100% { transform: scale(1) translateY(0); opacity: 1; }
}

/* Азамат секіруі / Citizen bob */
@keyframes citizenBob {
    from { transform: translateY(0); }
    to   { transform: translateY(-5px); }
}

/* Түтін / Chimney smoke rise */
@keyframes smokeRise {
    0%   { transform: translateX(-50%) translateY(0) scale(0.5); opacity: 0.6; }
    100% { transform: translateX(-50%) translateY(-52px) scale(2.8); opacity: 0; }
}

/* Ұшқын / Eco upgrade sparkle */
@keyframes sparkFly {
    from { transform: translate(-50%,-50%) rotate(var(--deg)) translateX(0) scale(1.3); opacity: 1; }
    to   { transform: translate(-50%,-50%) rotate(var(--deg)) translateX(var(--d)) scale(0); opacity: 0; }
}

/* Эко ғимарат жарқылы / Eco building glow */
@keyframes ecoGlow {
    0%, 100% { box-shadow: 0 0 15px rgba(74,222,128,0.45), 0 5px 15px rgba(0,0,0,0.3); }
    50%       { box-shadow: 0 0 40px rgba(74,222,128,0.85), 0 0 70px rgba(74,222,128,0.3); }
}

/* Күн панелі пайда болуы / Solar panel appear */
@keyframes solarAppear {
    from { transform: scale(0) rotate(-30deg); opacity: 0; }
    to   { transform: scale(1) rotate(0); opacity: 1; }
}

/* Жел турбина пайда болуы / Wind turbine appear */
@keyframes windAppear {
    from { transform: scale(0); opacity: 0; }
    to   { transform: scale(1); opacity: 1; }
}

/* Эко-парк пайда болуы / Eco park appear */
@keyframes parkAppear {
    0%   { transform: scale(0); opacity: 0; }
    70%  { transform: scale(1.15); opacity: 1; }
    100% { transform: scale(1); }
}

/* Атмосфера шыбыны / Firefly float (injected dynamically from main.js) */