/* ========================================
   シンプルアニメーション定義（v3.0）
   ======================================== */

/* 選択されたカード：中央から拡大フェードイン */
@keyframes scaleUpFadeIn {
    from {
        opacity: 0;
        transform: scale(0.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* 選択されたカード：縮小 → 拡大フェードアウト（力をためて反発） */
@keyframes shrinkExpandFadeOut {
    0% {
        opacity: 1;
        transform: scale(1);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    }
    20% {
        transform: scale(0.95);
        box-shadow: 0 0 20px rgba(102, 126, 234, 0.4);
    }
    100% {
        opacity: 0;
        transform: scale(1.15);
        box-shadow: 0 0 40px rgba(102, 126, 234, 0.6);
    }
}

/* 非選択カード：縮小フェードアウト（速め） */
@keyframes shrinkFadeOut {
    from {
        opacity: 1;
        transform: scale(1);
    }
    to {
        opacity: 0;
        transform: scale(0.9);
    }
}

/* 検索コンテンツ：フェードイン */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* 検索コンテンツ：小さ目からボヨンと拡大フェードイン */
@keyframes scaleBounceFadeIn {
    0% {
        opacity: 0;
        transform: scale(0.85);
    }
    60% {
        opacity: 1;
        transform: scale(1.02);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

/* 検索コンテンツ：フェードアウト */
@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

/* カード：下から上昇してフェードイン（通常サイズ） */
@keyframes riseAndFadeIn {
    from {
        opacity: 0;
        transform: translateY(20px) scale(1);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* アニメーションクラス */
.card-shrink-expand-fade {
    animation: shrinkExpandFadeOut var(--duration-card-shrink-expand) cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.card-shrink-fade {
    animation: shrinkFadeOut var(--duration-card-shrink) ease-out forwards;
}

.search-content-fade-in {
    animation: scaleBounceFadeIn var(--duration-search-panel) cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.search-content-fade-out {
    animation: fadeOut var(--duration-page-transition) ease-out forwards;
}

.card-rise-fade-in {
    animation: riseAndFadeIn var(--duration-card-rise) ease-out forwards;
}

.card-scale-fade-in {
    animation: scaleUpFadeIn var(--duration-card-rise) ease-out forwards;
}

/* アニメーション中はポインターイベントを無効化 */
.animating {
    pointer-events: none;
}