/* Efeito de flutuação e animação do Baú */
@keyframes float {
    0% { transform: translateY(0px) scale(1); }
    50% { transform: translateY(-10px) scale(1.05); }
    100% { transform: translateY(0px) scale(1); }
}

@keyframes pulse-glow {
    0% { box-shadow: 0 0 15px rgba(168, 85, 247, 0.4); }
    50% { box-shadow: 0 0 30px rgba(168, 85, 247, 0.8); }
    100% { box-shadow: 0 0 15px rgba(168, 85, 247, 0.4); }
}

.chest-overlay-container {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 50;
    pointer-events: none; /* Não atrapalha o clique no vídeo se estiver invisível */
}

.chest-card {
    pointer-events: auto;
    background: rgba(15, 12, 30, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 2px solid rgba(168, 85, 247, 0.4);
    border-radius: 24px;
    padding: 16px 24px;
    display: flex;
    align-items: center;
    gap: 20px;
    animation: float 4s ease-in-out infinite, pulse-glow 3s infinite;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.chest-card.hidden {
    display: none !important;
}

.chest-icon-wrapper {
    font-size: 42px;
    position: relative;
    cursor: pointer;
    transition: transform 0.2s;
}

.chest-icon-wrapper:hover {
    transform: scale(1.15) rotate(5deg);
}

.progress-circle-svg {
    transform: rotate(-90deg);
}