body {
    font-family: 'Inter', sans-serif;
  }
  
  .music-visualizer span {
    display: inline-block;
    width: 3px;
    margin-right: 1px;
    background: #14b8a6;
    animation: eq 1.2s ease-in-out infinite;
  }
  .music-visualizer span:nth-child(1) { height: 15px; animation-delay: 0.1s; }
  .music-visualizer span:nth-child(2) { height: 20px; animation-delay: 0.3s; }
  .music-visualizer span:nth-child(3) { height: 12px; animation-delay: 0.6s; }
  .music-visualizer span:nth-child(4) { height: 18px; animation-delay: 0.2s; }
  .music-visualizer span:nth-child(5) { height: 13px; animation-delay: 0.5s; }
  
  @keyframes eq {
    0% { transform: scaleY(0.8); }
    50% { transform: scaleY(1.5); }
    100% { transform: scaleY(0.8); }
  }
  
  /* Usar filter para cambiar el color de las imágenes SVG */
  .icon-svg {
    filter: brightness(0) saturate(100%) invert(13%) sepia(76%) saturate(7350%) hue-rotate(270deg) brightness(92%) contrast(110%);
  }
  
  /* Usar fill para cambiar el color si el SVG está inline y tiene currentColor */
  .icon-svg path {
    fill: currentColor;
  }
  
  /* Cambiar el color en el hover */
  .icon-svg:hover {
    fill: #9b4dca; /* Morado */
  }
  
  /* Personalizar el scrollbar */
  ::-webkit-scrollbar {
    width: 8px;
  }
  
  ::-webkit-scrollbar-track {
    background: #f1f1f1;
  }
  
  ::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
  }
  
  ::-webkit-scrollbar-thumb:hover {
    background: #555;
  }