@keyframes illusion_trail {
  0% { transform: translateX(0) scale(1); opacity: 1; }
  100% { transform: translateX(-20px) scale(0.8); opacity: 0; }
}
@keyframes heart_charm {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.3); opacity: 0.7; }
  100% { transform: scale(1); opacity: 1; }
}
@keyframes nine_tails_aura {
  0% { box-shadow: 0 0 10px #ff69b4; }
  50% { box-shadow: 0 0 30px #ff69b4, 0 0 50px #ff1493; }
  100% { box-shadow: 0 0 10px #ff69b4; }
}

/* 朱雀动画效果 */
@keyframes phoenix_flame {
  0% { box-shadow: 0 0 10px #ff4500; }
  50% { box-shadow: 0 0 40px #ff4500, 0 0 60px #ff6347, 0 0 80px #ff0000; }
  100% { box-shadow: 0 0 10px #ff4500; }
}
@keyframes flame_purify {
  0% { box-shadow: 0 0 15px #ff4500; background: rgba(255, 69, 0, 0.1); }
  50% { box-shadow: 0 0 50px #ff4500, 0 0 70px #ff6347; background: rgba(255, 69, 0, 0.3); }
  100% { box-shadow: 0 0 15px #ff4500; background: rgba(255, 69, 0, 0.1); }
}
@keyframes phoenix_resurrect {
  0% { transform: scale(1); box-shadow: 0 0 20px #ff4500; }
  25% { transform: scale(1.3); box-shadow: 0 0 60px #ff4500, 0 0 100px #ff0000; }
  50% { transform: scale(1.5); box-shadow: 0 0 100px #ff4500, 0 0 150px #ff6347; filter: brightness(1.5); }
  75% { transform: scale(1.2); box-shadow: 0 0 80px #ff4500; filter: brightness(1.2); }
  100% { transform: scale(1); box-shadow: 0 0 20px #ff4500; filter: brightness(1); }
}
@keyframes nirvana_glow {
  0% { background: radial-gradient(circle, rgba(255,69,0,0) 0%, rgba(255,69,0,0) 100%); }
  50% { background: radial-gradient(circle, rgba(255,69,0,0.5) 0%, rgba(255,69,0,0) 70%); }
  100% { background: radial-gradient(circle, rgba(255,69,0,0) 0%, rgba(255,69,0,0) 100%); }
}
        /* 玄武专属动画 */
        @keyframes turtle_shell {
            0% { box-shadow: 0 0 10px #00CED1; }
            50% { box-shadow: 0 0 30px #00CED1, 0 0 50px #4682B4; }
            100% { box-shadow: 0 0 10px #00CED1; }
        }
        @keyframes ice_shield {
            0% { transform: scale(0); opacity: 0; }
            50% { transform: scale(1.2); opacity: 1; background: rgba(0, 206, 209, 0.3); }
            100% { transform: scale(1); opacity: 0; }
        }
        @keyframes life_recovery {
            0% { transform: scale(0); opacity: 0; }
            50% { transform: scale(1.3); opacity: 1; background: rgba(50, 205, 50, 0.3); }
            100% { transform: scale(1); opacity: 0; }
        }
        @keyframes sea_guardian {
            0% { transform: scale(0); opacity: 0; }
            50% { transform: scale(1.5); opacity: 1; background: rgba(0, 100, 255, 0.2); }
            100% { transform: scale(1); opacity: 0; }
        }
        /* 白虎专属动画 */
        @keyframes tiger_roar {
            0% { transform: scale(1); filter: drop-shadow(0 0 5px #FFF); }
            25% { transform: scale(1.2); filter: drop-shadow(0 0 20px #FFF) drop-shadow(0 0 40px #DDD); }
            50% { transform: scale(1.4); filter: drop-shadow(0 0 30px #FFF) drop-shadow(0 0 60px #DDD); }
            75% { transform: scale(1.2); filter: drop-shadow(0 0 20px #FFF) drop-shadow(0 0 40px #DDD); }
            100% { transform: scale(1); filter: drop-shadow(0 0 5px #FFF); }
        }
        @keyframes blade_strike {
            0% { transform: translateX(-100vw) rotate(-45deg); opacity: 0; }
            50% { opacity: 1; }
            100% { transform: translateX(100vw) rotate(-45deg); opacity: 0; }
        }
        @keyframes blood_storm {
            0% { background: radial-gradient(circle, rgba(255,0,0,0) 0%, rgba(255,0,0,0) 100%); }
            25% { background: radial-gradient(circle, rgba(255,0,0,0.3) 0%, rgba(255,0,0,0.1) 70%); }
            50% { background: radial-gradient(circle, rgba(255,0,0,0.5) 0%, rgba(255,0,0,0.2) 70%); }
            75% { background: radial-gradient(circle, rgba(255,0,0,0.3) 0%, rgba(255,0,0,0.1) 70%); }
            100% { background: radial-gradient(circle, rgba(255,0,0,0) 0%, rgba(255,0,0,0) 100%); }
        }
        @keyframes white_tiger_aura {
            0% { box-shadow: 0 0 10px #F5F5F5; }
            50% { box-shadow: 0 0 30px #F5F5F5, 0 0 50px #DDD; }
            100% { box-shadow: 0 0 10px #F5F5F5; }
        }
        
        /* 饕餮专属动画 */
        @keyframes gluttony_pulse {
            0% { box-shadow: 0 0 10px #8B008B; }
            50% { box-shadow: 0 0 30px #8B008B, 0 0 50px #4B0082; }
            100% { box-shadow: 0 0 10px #8B008B; }
        }
        @keyframes devouring_maw {
            0% { transform: scale(0) rotate(0deg); opacity: 0; }
            50% { transform: scale(1.5) rotate(180deg); opacity: 1; background: radial-gradient(circle, rgba(139,0,139,0.8), rgba(75,0,130,0.4), transparent); }
            100% { transform: scale(2) rotate(360deg); opacity: 0; }
        }
        @keyframes abyss_opening {
            0% { transform: scale(0); opacity: 0; }
            30% { transform: scale(1.2); opacity: 1; background: radial-gradient(circle, rgba(0,0,0,0.9), rgba(139,0,139,0.5), transparent); }
            60% { transform: scale(1.5); opacity: 0.8; background: radial-gradient(circle, rgba(0,0,0,0.7), rgba(139,0,139,0.3), transparent); }
            100% { transform: scale(2); opacity: 0; }
        }
        /* 鲲鹏专属动画 */
        @keyframes wings_expand {
            0% { transform: scale(0.5) rotate(0deg); opacity: 0; }
            30% { transform: scale(1.2) rotate(15deg); opacity: 0.8; box-shadow: 0 0 30px #4169E1; }
            60% { transform: scale(1.5) rotate(-10deg); opacity: 1; box-shadow: 0 0 50px #4169E1, 0 0 80px #00BFFF; }
            100% { transform: scale(2) rotate(0deg); opacity: 0; box-shadow: 0 0 100px #4169E1; }
        }
        @keyframes transform_teleport {
            0% { transform: scale(1) translateY(0); opacity: 1; box-shadow: 0 0 20px #4169E1; }
            30% { transform: scale(1.5) translateY(-30px); opacity: 0.8; box-shadow: 0 0 60px #4169E1, 0 0 100px #00BFFF; }
            60% { transform: scale(0.5) translateY(30px); opacity: 0.6; box-shadow: 0 0 40px #4169E1; }
            100% { transform: scale(1) translateY(0); opacity: 0; box-shadow: 0 0 20px #4169E1; }
        }
        @keyframes sky_wings {
            0% { transform: scale(0) translateY(100vh); opacity: 0; }
            30% { transform: scale(1.2) translateY(-20vh); opacity: 0.9; box-shadow: 0 0 50px #4169E1, 0 0 80px #00BFFF; }
            60% { transform: scale(1.5) translateY(-40vh); opacity: 1; box-shadow: 0 0 100px #4169E1, 0 0 150px #00BFFF, 0 0 200px #87CEEB; }
            100% { transform: scale(2) translateY(-60vh); opacity: 0; box-shadow: 0 0 200px #4169E1; }
        }
        @keyframes feast_storm {
            0% { background: radial-gradient(circle, rgba(139,0,139,0) 0%, rgba(139,0,139,0) 100%); }
            25% { background: radial-gradient(circle, rgba(139,0,139,0.4) 0%, rgba(75,0,130,0.2) 50%, rgba(139,0,139,0) 100%); }
            50% { background: radial-gradient(circle, rgba(139,0,139,0.7) 0%, rgba(75,0,130,0.4) 50%, rgba(139,0,139,0.1) 100%); }
            75% { background: radial-gradient(circle, rgba(139,0,139,0.4) 0%, rgba(75,0,130,0.2) 50%, rgba(139,0,139,0) 100%); }
            100% { background: radial-gradient(circle, rgba(139,0,139,0) 0%, rgba(139,0,139,0) 100%); }
        }/* 凤凰专属动画 */
        @keyframes phoenix_light_beam {
            0% { transform: scale(0); opacity: 0; }
            30% { transform: scale(1.2); opacity: 1; background: radial-gradient(circle, rgba(255,215,0,0.8), rgba(255,165,0,0.4), transparent); }
            60% { transform: scale(1); opacity: 0.8; background: radial-gradient(circle, rgba(255,215,0,0.6), rgba(255,165,0,0.3), transparent); }
            100% { transform: scale(1.5); opacity: 0; background: radial-gradient(circle, rgba(255,215,0,0), transparent); }
        }
        @keyframes phoenix_feather {
            0% { transform: translateY(-20px) rotate(0deg); opacity: 0; }
            20% { opacity: 1; transform: translateY(10px) rotate(10deg); }
            40% { transform: translateY(30px) rotate(-5deg); opacity: 0.8; }
            60% { transform: translateY(50px) rotate(15deg); opacity: 0.6; }
            80% { transform: translateY(70px) rotate(-10deg); opacity: 0.4; }
            100% { transform: translateY(100px) rotate(5deg); opacity: 0; }
        }
        @keyframes phoenix_rebirth_aura {
            0% { transform: scale(1); box-shadow: 0 0 20px #FF6347; filter: brightness(1); }
            25% { transform: scale(1.4); box-shadow: 0 0 60px #FF6347, 0 0 100px #FF4500; filter: brightness(1.5); }
            50% { transform: scale(1.8); box-shadow: 0 0 100px #FF6347, 0 0 150px #FF4500, 0 0 200px #FFD700; filter: brightness(2); }
            75% { transform: scale(1.5); box-shadow: 0 0 80px #FF6347, 0 0 120px #FF4500; filter: brightness(1.3); }
            100% { transform: scale(1); box-shadow: 0 0 20px #FF6347; filter: brightness(1); }
        }
    /* 棋格鼠标提示面板 */
    #tile-tooltip {
        display: none;
        position: fixed;
        z-index: 9999;
        pointer-events: none;
        min-width: 220px;
        max-width: 320px;
        background: linear-gradient(135deg, rgba(15,10,30,0.96), rgba(30,20,50,0.96));
        border: 1.5px solid rgba(255,215,0,0.5);
        border-radius: 10px;
        padding: 12px 14px;
        box-shadow: 0 4px 24px rgba(0,0,0,0.7), 0 0 12px rgba(255,215,0,0.15);
        font-size: 13px;
        color: #e0d8c8;
        line-height: 1.5;
        backdrop-filter: blur(8px);
    }
    #tile-tooltip .tt-header {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 8px;
        padding-bottom: 6px;
        border-bottom: 1px solid rgba(255,215,0,0.25);
    }
    #tile-tooltip .tt-icon {
        font-size: 24px;
    }
    #tile-tooltip .tt-name {
        font-size: 16px;
        font-weight: bold;
        color: #FFD700;
        font-family: "STKaiti", "华文楷体", "KaiTi", "楷体", "Noto Serif SC", serif;
    }
    #tile-tooltip .tt-type {
        font-size: 11px;
        padding: 1px 6px;
        border-radius: 4px;
        background: rgba(255,255,255,0.1);
        color: #aaa;
        margin-left: auto;
    }
    #tile-tooltip .tt-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 2px 0;
    }
    #tile-tooltip .tt-label {
        color: #999;
        font-size: 12px;
    }
    #tile-tooltip .tt-val {
        color: #F1C40F;
        font-weight: bold;
    }
    #tile-tooltip .tt-val.bad { color: #FF6B6B; }
    #tile-tooltip .tt-val.good { color: #7FDBFF; }
    #tile-tooltip .tt-desc {
        margin-top: 6px;
        padding-top: 6px;
        border-top: 1px solid rgba(255,255,255,0.08);
        font-size: 12px;
        color: #bbb;
        font-style: italic;
    }
    #tile-tooltip .tt-upgrade-table {
        width: 100%;
        margin-top: 6px;
        border-collapse: collapse;
        font-size: 11px;
    }
    #tile-tooltip .tt-upgrade-table th {
        color: #999;
        font-weight: normal;
        text-align: center;
        padding: 2px 4px;
        border-bottom: 1px solid rgba(255,255,255,0.1);
    }
    #tile-tooltip .tt-upgrade-table td {
        text-align: center;
        padding: 2px 4px;
        color: #ddd;
    }
    #tile-tooltip .tt-upgrade-table tr.tt-current td {
        color: #FFD700;
        font-weight: bold;
    }
    #tile-tooltip .tt-events {
        margin-top: 6px;
        padding-top: 6px;
        border-top: 1px solid rgba(255,255,255,0.08);
    }
    #tile-tooltip .tt-events .tt-ev-title {
        font-size: 12px;
        color: #9B59B6;
        margin-bottom: 3px;
    }
    #tile-tooltip .tt-events .tt-ev-item {
        font-size: 11px;
        color: #bbb;
        padding: 1px 0;
    }
