#audio-visualizer {
    position: absolute;
    top: -30px;
    left: 0;
    width: 100%;
    height: 30px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.5s ease;
    z-index: 25;
    overflow: hidden;
}

.visualizer {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 100%;
      display: flex;
      align-items: end;
      justify-content: space-around;
      pointer-events: none;
      z-index: 1;
      border-radius: 12px;
      overflow: hidden;
    }

.music-player {
    overflow: visible !important;
}

.hotline-miami-theme #audio-visualizer {
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
    filter: contrast(1.2) saturate(1.5);
    border-radius: 0;
    background: linear-gradient(180deg, 
        rgba(0, 168, 243, 0.2) 0%, 
        rgba(216, 30, 91, 0.3) 50%, 
        rgba(242, 159, 5, 0.2) 100%);
}

.akai-theme #audio-visualizer {
    filter: drop-shadow(0 0 8px rgba(255, 0, 0, 0.6));
    border-radius: 16px 16px 0 0;
    background: linear-gradient(180deg, 
        rgba(255, 0, 0, 0.1) 0%, 
        rgba(80, 0, 0, 0.2) 100%);
}

.star-glitcher-theme #audio-visualizer {
    filter: drop-shadow(0 0 10px var(--sg-primary));
    border-radius: 16px 16px 0 0;
    background: linear-gradient(180deg, 
        rgba(var(--sg-primary-rgb), 0.1) 0%, 
        rgba(var(--sg-primary-rgb), 0.05) 100%);
}

.star-glitcher-theme.sg-chaos #audio-visualizer {
    animation: visualizer-chaos-glow 4s linear infinite;
}

@keyframes visualizer-chaos-glow {
    0%   { filter: drop-shadow(0 0 10px #ff0000); }
    25%  { filter: drop-shadow(0 0 10px #00ff00); }
    50%  { filter: drop-shadow(0 0 10px #0000ff); }
    75%  { filter: drop-shadow(0 0 10px #ffff00); }
    100% { filter: drop-shadow(0 0 10px #ff0000); }
}

.frutiger-aero-theme #audio-visualizer {
    bottom: -30px !important;
    top: auto !important;
    transform: none;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
    border-radius: 0;
    background: linear-gradient(to top, 
        rgba(255, 255, 255, 0.08) 0%, 
        rgba(173, 216, 230, 0.05) 50%,
        transparent 100%);
    box-shadow: 
        inset 0 -2px 4px rgba(255, 255, 255, 0.3),
        inset 0 2px 4px rgba(173, 216, 230, 0.2);
}

body:not(.hotline-miami-theme):not(.frutiger-aero-theme) #audio-visualizer {
    border-radius: 16px 16px 0 0;
}

.frutiger-aero-theme .music-player {
    overflow: visible !important;
}

.star-glitcher-theme .socials-bar {
    bottom: 120px;
    z-index: 30;
}

@media (max-width: 768px) {
    #audio-visualizer {
        height: 25px;
        top: -25px;
    }
    
    body:not(.hotline-miami-theme):not(.frutiger-aero-theme) #audio-visualizer {
        border-radius: 12px 12px 0 0;
    }
    
    .frutiger-aero-theme #audio-visualizer {
        bottom: -25px !important;
        top: auto !important;
        border-radius: 0;
    }

    .star-glitcher-theme .socials-bar {
        bottom: 105px;
    }
}

@media (max-width: 480px) {
    #audio-visualizer {
        height: 20px;
        top: -20px;
    }
    
    body:not(.hotline-miami-theme):not(.frutiger-aero-theme) #audio-visualizer {
        border-radius: 10px 10px 0 0;
    }
    
    .frutiger-aero-theme #audio-visualizer {
        bottom: -20px !important;
        top: auto !important;
        border-radius: 0;
    }

    .star-glitcher-theme .socials-bar {
        bottom: 95px;
    }
}