Audio Plugin Header Bar with Icon Controls

<div class="flex items-center justify-between gap-3 w-full max-w-3xl border border-black/5 p-3 rounded-full">
  <div class="flex items-center gap-3">
    <button id="powerBtn" class="size-9 rounded-full border border-neutral-200 bg-white shadow-sm flex items-center justify-center hover:border-neutral-300 transition-colors" aria-label="Power">
                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-power size-4 w-[16px] h-[16px]" data-lucide="power" style="width: 16px; height: 16px; color: rgb(64, 64, 64);"><line x1="4" x2="20" y1="12" y2="12"></line><line x1="4" x2="20" y1="6" y2="6"></line><line x1="4" x2="20" y1="18" y2="18"></line></svg>
              </button>
    <div class="relative">
      <button class="flex items-center gap-2 rounded-full border border-neutral-200 bg-white px-4 h-9 text-sm text-neutral-700 shadow-sm hover:border-neutral-300">
                  <span class="whitespace-nowrap">Studio Wide</span>
                  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="chevron-down" class="lucide lucide-chevron-down size-4 text-neutral-500"><path d="m6 9 6 6 6-6"></path></svg>
                </button>
    </div>
  </div>

  <div class="text-center">
    <div class="text-[16px] tracking-tight font-semibold text-neutral-800">Nebula Echo</div>
    <div class="text-[10px] uppercase tracking-wider text-neutral-400">Stereo Engine</div>
  </div>

  <div class="flex gap-2 items-center">
    <button class="size-9 rounded-full border border-neutral-200 bg-white shadow-sm flex items-center justify-center hover:border-neutral-300" aria-label="Link Channels">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="link-2" class="lucide lucide-link-2 size-4 text-orange-500"><path d="M9 17H7A5 5 0 0 1 7 7h2"></path><path d="M15 7h2a5 5 0 1 1 0 10h-2"></path><line x1="8" x2="16" y1="12" y2="12"></line></svg>
              </button>
    <button class="size-9 rounded-full border border-neutral-200 bg-white shadow-sm flex items-center justify-center hover:border-neutral-300" aria-label="Randomize">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="shuffle" class="lucide lucide-shuffle size-4 text-neutral-700"><path d="m18 14 4 4-4 4"></path><path d="m18 2 4 4-4 4"></path><path d="M2 18h1.973a4 4 0 0 0 3.3-1.7l5.454-8.6a4 4 0 0 1 3.3-1.7H22"></path><path d="M2 6h1.972a4 4 0 0 1 3.6 2.2"></path><path d="M22 18h-6.041a4 4 0 0 1-3.3-1.8l-.359-.45"></path></svg>
              </button>
    <button class="size-9 rounded-full border border-neutral-200 bg-white shadow-sm flex items-center justify-center hover:border-neutral-300" aria-label="Reverse">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="refresh-ccw" class="lucide lucide-refresh-ccw size-4 text-neutral-700"><path d="M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"></path><path d="M3 3v5h5"></path><path d="M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16"></path><path d="M16 16h5v5"></path></svg>
              </button>
    <button class="size-9 rounded-full border border-neutral-200 bg-white shadow-sm flex items-center justify-center hover:border-neutral-300" aria-label="Reset">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="undo-2" class="lucide lucide-undo-2 size-4 text-neutral-700"><path d="M9 14 4 9l5-5"></path><path d="M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11"></path></svg>
              </button>
  </div>
</div>