/* Performance Optimizations */

/* GPU Acceleration for animated elements only */
.music-note,
.notification,
.visual-keyboard,
.loader {
    will-change: transform, opacity;
    backface-visibility: hidden;
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .music-note {
        display: none;
    }
}

/* Reduce paint areas for frequently updated elements */
.status-indicator,
#volume-display,
#player-count,
.status-text {
    contain: layout;
}

/* Optimize scrolling */
#controls-panel,
.help-content {
    -webkit-overflow-scrolling: touch;
}

/* High contrast mode */
@media (prefers-contrast: high) {
    .control-btn {
        border: 2px solid currentColor;
    }
    .notification {
        border: 2px solid currentColor;
    }
}

/* Reduce complexity for low-end devices */
@media (max-device-memory: 2) {
    #music-notes-container {
        display: none;
    }
}

/* Focus visible for keyboard navigation */
.control-btn:focus-visible,
.piano-key:focus-visible,
.drum-pad:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 2px;
}

/* Print styles */
@media print {
    #controls-panel,
    .visual-keyboard,
    #help-btn,
    #loading-screen,
    .notification,
    #music-notes-container,
    a-scene {
        display: none !important;
    }
}