/* Custom styles */
.audio-player {
    width: 100%;
    margin: 1rem 0;
}

.audio-player::-webkit-media-controls-panel {
    background-color: #f3f4f6;
}

/* Mobile-first responsive adjustments */
@media (max-width: 640px) {
    .container {
        padding: 1rem;
    }
    
    .grid {
        gap: 1rem;
    }
    
    .audio-controls {
        flex-direction: column;
    }
    
    .audio-controls button {
        width: 100%;
        margin: 0.25rem 0;
    }
}

/* Loading states */
.loading {
    opacity: 0.7;
    pointer-events: none;
}

/* Transitions */
.fade-enter {
    opacity: 0;
}

.fade-enter-active {
    opacity: 1;
    transition: opacity 200ms ease-in;
}

.fade-exit {
    opacity: 1;
}

.fade-exit-active {
    opacity: 0;
    transition: opacity 200ms ease-in;
}