/*
 * bh-player.css — Global persistent audio player (extracted from bh-full-page.php).
 * Enqueued GLOBALLY on all front-end pages via includes/global-player.php so the
 * player (#bh-gp audio host, #bh-vault-player pill, #bh-fp fullscreen) survives
 * navigation to non-app pages (CPT archives like /novedades/, theme pages, etc.).
 * Selectors are scoped to the player subtrees; the :root token below is an
 * identical fallback to the template inline default (safe no-op where a page
 * already defines --bh-accent).
 */
    :root{--bh-accent:#22B6FF;--bh-accent-hi:#7FD0FF;--bh-accent-rgb:34,182,255;}
    /* ── Fullscreen player (#bh-fp) ── */
    /*
     * IMPORTANT: No default CSS transform here.
     * GSAP owns the transform via inline style.
     * CSS-only fallback (no GSAP) uses .bh-fp--open class.
     */
    #bh-fp{
      position:fixed;inset:0;z-index:100001;
      display:flex;flex-direction:column;align-items:center;
      background:linear-gradient(180deg,#100f1f 0%,#07060f 100%);
      padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,24px);
      will-change:transform;
      overscroll-behavior:contain;
      -webkit-overflow-scrolling:touch;
    }
    /* CSS-only fallback (no GSAP) */
    #bh-fp:not([style*="transform"]){transform:translateY(100%);transition:transform .4s cubic-bezier(.22,1,.36,1);}
    #bh-fp.bh-fp--open:not([style*="transform"]){transform:translateY(0);}
    #bh-fp[hidden]{display:none !important;}
    /* ── Floating particles ── */
    .bh-fp__particles{
      position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0;
    }
    .bh-fp__particles span{
      position:absolute;border-radius:50%;
      background:radial-gradient(circle,rgba(var(--bh-accent-rgb),.6) 0%,transparent 70%);
      animation:bhFpFloat linear infinite;
      opacity:0;
    }
    .bh-fp__particles span:nth-child(1){width:120px;height:120px;left:10%;animation-duration:18s;animation-delay:0s;}
    .bh-fp__particles span:nth-child(2){width:80px;height:80px;left:70%;animation-duration:14s;animation-delay:-5s;}
    .bh-fp__particles span:nth-child(3){width:200px;height:200px;left:40%;animation-duration:22s;animation-delay:-9s;}
    .bh-fp__particles span:nth-child(4){width:60px;height:60px;left:25%;animation-duration:16s;animation-delay:-3s;}
    .bh-fp__particles span:nth-child(5){width:140px;height:140px;left:80%;animation-duration:20s;animation-delay:-12s;}
    @keyframes bhFpFloat{
      0%{transform:translateY(110vh) scale(0.4);opacity:0;}
      10%{opacity:.18;}
      80%{opacity:.12;}
      100%{transform:translateY(-20vh) scale(1.1);opacity:0;}
    }

    /* ── FP Tabs ── */
    .bh-fp__tabs{
      display:flex;gap:4px;background:rgba(255,255,255,.06);
      border-radius:20px;padding:3px;
    }
    .bh-fp__tab{
      padding:6px 18px;border-radius:16px;border:none;background:transparent;
      font:700 11px/1 'Manrope',sans-serif;letter-spacing:.06em;text-transform:uppercase;
      color:rgba(255,255,255,.4);cursor:pointer;transition:color .2s,background .2s;
      -webkit-tap-highlight-color:transparent;
    }
    .bh-fp__tab.is-active{
      background:rgba(var(--bh-accent-rgb),.25);color:var(--bh-accent-hi);
      box-shadow:0 0 16px rgba(var(--bh-accent-rgb),.2);
    }
    .bh-fp__tab:hover:not(.is-active){color:rgba(255,255,255,.65);}

    /* ── FP Panels ── */
    .bh-fp__panel{
      display:flex;flex-direction:column;align-items:center;
      width:100%;flex:1;min-height:0;
    }
    .bh-fp__panel[hidden]{display:none !important;}

    /* ── Avatar ── */
    .bh-fp__avatar-wrap{flex-shrink:0;}
    .bh-fp__avatar{
      width:44px!important;height:44px!important;aspect-ratio:1/1;
      border-radius:50%;object-fit:cover!important;
      border:2px solid rgba(var(--bh-accent-rgb),.35);
      background:rgba(var(--bh-accent-rgb),.12);
      box-shadow:0 0 16px rgba(var(--bh-accent-rgb),.25);
    }

    /* ── Vinyl ring on artwork ── */
    .bh-fp__vinyl-ring{
      position:absolute;inset:-8px;border-radius:50%;
      border:2px solid rgba(var(--bh-accent-rgb),.18);
      opacity:0;pointer-events:none;
      transition:opacity .4s;
    }
    #bh-fp.bh-fp--playing .bh-fp__vinyl-ring{
      opacity:1;
      animation:bhVinylSpin 8s linear infinite;
    }
    @keyframes bhVinylSpin{
      from{transform:rotate(0deg);}
      to{transform:rotate(360deg);}
    }
    /* Play button pulse when playing */
    #bh-fp.bh-fp--playing .bh-fp__ctrl--play{
      animation:bhPlayPulse 2.4s ease-in-out infinite;
    }
    @keyframes bhPlayPulse{
      0%,100%{box-shadow:0 8px 32px rgba(var(--bh-accent-rgb),.55),0 0 0 0 rgba(var(--bh-accent-rgb),.25);}
      50%{box-shadow:0 8px 32px rgba(var(--bh-accent-rgb),.75),0 0 0 12px rgba(var(--bh-accent-rgb),.0);}
    }

    /* ── Lyrics panel ── */
    /* ── Lyrics panel: TikTok / Reels aesthetic ── */
    .bh-fp__lyrics-header{
      position:relative;z-index:2;
      display:flex;align-items:center;gap:10px;
      width:100%;padding:6px 20px 8px;box-sizing:border-box;flex-shrink:0;
    }
    .bh-fp__lyrics-thumb{display:none;}
    .bh-fp__lyrics-meta{display:flex;flex-direction:column;gap:2px;min-width:0;}
    .bh-fp__lyrics-meta-title{
      font:800 15px/1.2 'Syne',sans-serif;color:#f0edea;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      letter-spacing:-.01em;
    }
    .bh-fp__lyrics-meta-artist{
      font:600 10px/1 'DM Mono',monospace;color:var(--bh-accent-hi);
      letter-spacing:.1em;text-transform:uppercase;
    }
    .bh-fp__lyrics-scroll{
      flex:1;width:100%;overflow-y:auto;overflow-x:hidden;
      padding:8px 0 0;box-sizing:border-box;
      overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
      /* Premium karaoke fade: lines dissolve toward the top/bottom edges so the
         centered active verse is the focus (Apple-Music style). */
      -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 11%,#000 80%,transparent 100%);
      mask-image:linear-gradient(to bottom,transparent 0,#000 11%,#000 80%,transparent 100%);
    }
    .bh-fp__lyrics-scroll::-webkit-scrollbar{display:none;}
    /* Symmetric centered column — capped width so lines wrap evenly + look tidy */
    .bh-fp__lyrics-lines{
      display:flex;flex-direction:column;gap:16px;
      padding:24px 24px 50vh;text-align:center;
      max-width:560px;margin:0 auto;box-sizing:border-box;
    }
    .bh-fp__lyric-line{
      font:600 18px/1.55 'Syne',system-ui,sans-serif;
      color:rgba(240,237,234,.26);
      cursor:default;padding:0;margin:0 auto;max-width:34ch;
      overflow-wrap:anywhere;word-break:break-word;
      transform:scale(.98);transform-origin:center center;
      /* Fluid karaoke: emphasis via composited transform/opacity only — NEVER
         font-weight or font-size (those change glyph widths → reflow + re-wrap,
         the jank that made lines "deform" on Mac). */
      transition:color .38s ease,transform .5s cubic-bezier(.22,1,.36,1),
                 text-shadow .38s ease;
      will-change:transform;
    }
    /* clickable when timestamps exist — tap a line to jump there (great for editing) */
    .bh-fp__lyric-line.is-seekable{cursor:pointer;}
    .bh-fp__lyric-line.is-seekable:hover{color:rgba(240,237,234,.6);}
    .bh-fp__lyric-line--instr{
      font-size:13px;color:rgba(var(--bh-accent-rgb),.4);letter-spacing:.16em;
    }
    /* Active line: same weight + size (no reflow). Pop comes from scale + glow. */
    .bh-fp__lyric-line.is-current{
      color:#fff;transform:scale(1.045);
      text-shadow:0 0 30px rgba(var(--bh-accent-rgb),.45),0 2px 14px rgba(0,0,0,.55);
    }
    .bh-fp__lyric-line.is-past{color:rgba(240,237,234,.34);transform:scale(.98);}
    /* Respect reduced-motion: no scale animation, emphasis stays via color. */
    @media (prefers-reduced-motion: reduce){
      .bh-fp__lyric-line,.bh-fp__lyric-line.is-current,.bh-fp__lyric-line.is-past{
        transform:none;transition:color .2s ease;
      }
    }
    /* Plain-text (no LRC timestamps) — fully visible, but still show a progress-based
       karaoke highlight (syncLyrics estimates the active line from audio progress). */
    .bh-fp__lyric-line--static{color:rgba(240,237,234,.82) !important;font-size:17px !important;line-height:1.6 !important;cursor:pointer;transition:color .35s ease,transform .5s cubic-bezier(.22,1,.36,1),text-shadow .35s ease;}
    .bh-fp__lyric-line--static.is-current{color:#fff !important;transform:scale(1.03);text-shadow:0 0 30px rgba(var(--bh-accent-rgb),.45),0 2px 14px rgba(0,0,0,.55);}
    .bh-fp__lyric-line--static.is-past{color:rgba(240,237,234,.42) !important;transform:scale(.985);}
    @media (prefers-reduced-motion: reduce){.bh-fp__lyric-line--static.is-current,.bh-fp__lyric-line--static.is-past{transform:none;}}
    .bh-fp__lyrics-empty{
      text-align:center;font:600 14px/1.6 'Manrope',sans-serif;
      color:rgba(240,237,234,.25);padding:24px 0 48px;
    }
    /* No-lyrics art card */
    .bh-fp__lyr-nolyrics{
      display:flex;flex-direction:column;align-items:center;
      padding:32px 0 24px;
    }
    .bh-fp__lyr-cover{
      width:min(200px,calc(100vw - 80px));
      aspect-ratio:1;border-radius:16px;
      object-fit:cover;
      box-shadow:0 16px 48px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.07);
      margin-bottom:20px;
      animation:bhLyrArtIn .38s cubic-bezier(.22,1,.36,1) both;
    }
    @keyframes bhLyrArtIn{
      from{opacity:0;transform:scale(.88) translateY(14px);}
      to{opacity:1;transform:none;}
    }
    /* Lyrics scroll: gentle edge fade only — keep nearly all lines readable
       (was black 18%–68%, which faded out the bottom third and looked cut off). */
    .bh-fp__lyrics-scroll{
      mask-image:linear-gradient(to bottom,transparent 0%,black 7%,black 93%,transparent 100%);
      -webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 7%,black 93%,transparent 100%);
    }
    .bh-fp__lyrics-footer{width:100%;flex-shrink:0;padding:4px 0 0;}
    .bh-fp__panel--lyrics{overflow:hidden;}
    .bh-fp__lyrics-footer .bh-fp__prog-wrap{padding:0 24px;margin-bottom:4px;}
    .bh-fp__lyrics-footer .bh-fp__controls{margin-bottom:14px;}

    /* ── Lyrics availability states ── */
    #bh-fp .bh-fp__tab[data-tab="lyrics"]{
      opacity:.28;pointer-events:none;transition:opacity .3s;
    }
    #bh-fp.bh-fp--has-lyrics .bh-fp__tab[data-tab="lyrics"]{
      opacity:1;pointer-events:auto;
    }
    #bh-fp-lyr-btn{transition:color .2s,opacity .2s;}
    #bh-fp-lyr-btn svg{pointer-events:none;}
    #bh-fp:not(.bh-fp--has-lyrics) #bh-fp-lyr-btn{
      opacity:.22;cursor:default;pointer-events:none;
    }
    #bh-fp.bh-fp--has-lyrics #bh-fp-lyr-btn{color:var(--bh-accent-hi);}
    #bh-fp.bh-fp--has-lyrics #bh-fp-lyr-btn:hover{color:#fff;background:rgba(var(--bh-accent-rgb),.15);}
    #bh-fp.bh-fp--has-lyrics .bh-fp__tab[data-tab="lyrics"]::after{
      content:'';display:inline-block;width:5px;height:5px;border-radius:50%;
      background:var(--bh-accent-hi);margin-left:5px;vertical-align:middle;box-shadow:0 0 6px var(--bh-accent-hi);
    }

    /* ── Studio tab — always active, redirects to studio page ── */
    #bh-fp .bh-fp__tab[data-tab="studio"]{opacity:1;pointer-events:auto;transition:opacity .3s;}
    #bh-fp.bh-fp--has-studio .bh-fp__tab[data-tab="studio"]{opacity:1;pointer-events:auto;}
    #bh-fp.bh-fp--has-studio .bh-fp__tab[data-tab="studio"]::after{
      content:'';display:inline-block;width:5px;height:5px;border-radius:50%;
      background:#ef4444;margin-left:5px;vertical-align:middle;box-shadow:0 0 6px #ef4444;
    }
    /* ── Studio panel ── */
    #bh-fp-panel-studio{display:flex;flex-direction:column;gap:11px;padding:14px 20px 20px;overflow-y:auto;flex:1;}
    .bh-fp__studio-header{display:flex;align-items:center;justify-content:space-between;}
    .bh-fp__studio-notice{display:flex;align-items:center;gap:6px;font-size:11px;color:rgba(255,255,255,.5);background:rgba(255,200,0,.06);border:1px solid rgba(255,200,0,.11);border-radius:8px;padding:6px 10px;}
    .bh-fp__studio-key-badge{font-size:10px;font-weight:700;letter-spacing:.06em;color:rgba(255,255,255,.45);text-transform:uppercase;background:rgba(255,255,255,.07);border-radius:4px;padding:2px 6px;}
    .bh-fp__studio-genres{display:flex;gap:5px;flex-wrap:wrap;}
    .bh-fp__studio-genre{padding:4px 11px;border-radius:20px;border:1px solid rgba(255,255,255,.13);background:transparent;color:rgba(255,255,255,.55);font-size:11px;cursor:pointer;transition:all .18s;}
    .bh-fp__studio-genre.is-active,.bh-fp__studio-genre:hover{border-color:#ef4444;color:#fff;background:rgba(239,68,68,.13);}
    .bh-fp__studio-sliders{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;}
    .bh-fp__studio-knob{display:flex;flex-direction:column;gap:3px;}
    .bh-fp__studio-knob-top{display:flex;justify-content:space-between;font-size:10px;color:rgba(255,255,255,.45);}
    .bh-fp__studio-slider{width:100%;height:3px;accent-color:#ef4444;cursor:pointer;}
    .bh-fp__studio-transport{display:flex;align-items:center;gap:8px;}
    .bh-fp__studio-rec{display:flex;align-items:center;gap:6px;padding:7px 13px;border-radius:22px;background:rgba(239,68,68,.13);border:1px solid rgba(239,68,68,.32);color:#f87171;font-size:12px;font-weight:600;cursor:pointer;transition:all .18s;flex-shrink:0;}
    .bh-fp__studio-rec.is-recording{background:rgba(239,68,68,.28);border-color:#ef4444;color:#fff;}
    .bh-fp__studio-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0;}
    .bh-fp__studio-rec.is-recording .bh-fp__studio-dot{animation:fp-studio-blink 1s infinite;}
    @keyframes fp-studio-blink{0%,100%{opacity:1;}50%{opacity:.25;}}
    .bh-fp__studio-canvas{flex:1;min-width:0;height:36px;border-radius:6px;background:rgba(255,255,255,.04);}
    .bh-fp__studio-play{display:flex;align-items:center;gap:5px;padding:6px 11px;border-radius:22px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);color:rgba(255,255,255,.75);font-size:11px;cursor:pointer;transition:all .18s;flex-shrink:0;}
    .bh-fp__studio-play:hover{background:rgba(255,255,255,.13);}
    .bh-fp__studio-status{font-size:10px;color:rgba(255,255,255,.35);text-align:center;padding-bottom:4px;}
    .bh-fp__studio-sync{display:flex;align-items:center;gap:8px;padding:0 2px;}
    .bh-fp__studio-sync-label{font-size:9px;color:rgba(255,255,255,.3);flex-shrink:0;text-transform:uppercase;letter-spacing:.05em;}
    .bh-fp__studio-sync-slider{flex:1;height:3px;accent-color:#6366f1;cursor:pointer;}
    .bh-fp__studio-sync-val{font-size:9px;color:rgba(255,255,255,.45);min-width:46px;text-align:right;font-variant-numeric:tabular-nums;}
    .bh-fp__studio-full-link{display:flex;align-items:center;justify-content:center;gap:5px;font-size:10px;color:rgba(255,255,255,.3);text-decoration:none;padding:2px 0;transition:color .2s;}
    .bh-fp__studio-full-link:hover{color:rgba(255,255,255,.65);}

    /* Lyrics progress bar */
    #bh-fp-lyrics-progress{
      --_fill:0%;-webkit-appearance:none;appearance:none;
      width:100%;height:4px;border-radius:3px;
      background:linear-gradient(to right,var(--bh-accent) 0%,var(--bh-accent) var(--_fill),rgba(255,255,255,.12) var(--_fill),rgba(255,255,255,.12) 100%)!important;
      outline:none;cursor:pointer;margin:0 0 8px;display:block;
    }
    #bh-fp-lyrics-progress::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;margin-top:-4px;box-shadow:0 0 8px rgba(var(--bh-accent-rgb),.6);}
    #bh-fp-lyrics-progress::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#fff;border:none;}

    /* ── Aux controls ── */
    .bh-fp__controls-aux{
      display:flex;align-items:center;justify-content:center;gap:8px;
      width:100%;padding:0 24px;box-sizing:border-box;flex-shrink:0;margin-bottom:10px;
    }
    .bh-fp__ctrl--aux{
      width:36px;height:36px;border-radius:50%;font-size:0;
      position:relative;
    }
    .bh-fp__ctrl--aux svg{width:18px;height:18px;pointer-events:none;}
    .bh-fp__ctrl--aux.is-active{color:var(--bh-accent-hi);}
    .bh-fp__ctrl--aux.is-active::after{
      content:'';position:absolute;bottom:3px;left:50%;transform:translateX(-50%);
      width:4px;height:4px;border-radius:50%;background:var(--bh-accent-hi);
    }

    /* ── Queue panel ── */
    .bh-fp__queue{
      position:absolute;inset:0;z-index:2;
      background:rgba(7,6,15,.96);
      display:flex;flex-direction:column;
      transform:translateY(100%);
    }
    .bh-fp__queue[hidden]{display:none !important;}
    .bh-fp__queue-header{
      display:flex;align-items:center;justify-content:space-between;
      padding:20px 24px 14px;flex-shrink:0;
    }
    .bh-fp__queue-title{
      font:700 14px/1 'Manrope',sans-serif;color:#f0edea;letter-spacing:.04em;
    }
    .bh-fp__queue-close{
      width:32px;height:32px;border:none;background:rgba(255,255,255,.07);
      border-radius:50%;color:rgba(255,255,255,.55);cursor:pointer;
      display:flex;align-items:center;justify-content:center;
      -webkit-tap-highlight-color:transparent;
    }
    .bh-fp__queue-close svg{width:14px;height:14px;pointer-events:none;}
    .bh-fp__queue-list{
      flex:1;overflow-y:auto;padding:0 16px 24px;
      overscroll-behavior:contain;
    }
    .bh-fp__queue-list::-webkit-scrollbar{display:none;}
    .bh-fp__queue-item{
      display:flex;align-items:center;gap:12px;
      padding:10px 8px;border-radius:10px;cursor:pointer;
      transition:background .15s;
    }
    .bh-fp__queue-item:hover,.bh-fp__queue-item.is-current{background:rgba(var(--bh-accent-rgb),.1);}
    .bh-fp__queue-item.is-current .bh-fp__queue-title{color:var(--bh-accent-hi);}
    .bh-fp__queue-art{
      flex:0 0 40px;width:40px!important;height:40px!important;aspect-ratio:1/1;
      border-radius:8px;object-fit:cover!important;
      background:rgba(255,255,255,.05);
    }
    .bh-fp__queue-meta{display:flex;flex-direction:column;gap:3px;min-width:0;}
    .bh-fp__queue-title{
      font:600 13px/1.2 'Manrope',sans-serif;color:#f0edea;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
    .bh-fp__queue-artist{
      font:500 10px/1 'DM Mono',monospace;color:rgba(var(--bh-accent-rgb),.7);
      letter-spacing:.07em;text-transform:uppercase;
    }
    .bh-fp__queue-empty{
      text-align:center;padding:40px 0;font:600 13px/1 'Manrope',sans-serif;
      color:rgba(255,255,255,.25);
    }
    #bh-fp-art-bg{
      position:absolute;inset:0;z-index:0;
      background-size:cover;background-position:center;
      /* Was blur(90px) — a full-viewport 90px blur is expensive to rasterize,
         and doing it right as #bh-fp's open transform-animates in is what
         made expand feel laggy. 48px reads just as "ambient/diffused" at a
         fraction of the compositing cost. will-change promotes this to its
         own GPU layer so the blur is computed once, not every frame. */
      filter:blur(48px) brightness(.3) saturate(2.2);
      transform:scale(1.25);
      opacity:0;transition:opacity .8s;pointer-events:none;
      will-change:opacity;
    }
    #bh-fp.bh-fp--has-art #bh-fp-art-bg{opacity:1;}
    @keyframes bh-orb-drift{
      0%{transform:translate(0,0) scale(1);}
      33%{transform:translate(18px,-22px) scale(1.08);}
      66%{transform:translate(-14px,16px) scale(.94);}
      100%{transform:translate(0,0) scale(1);}
    }
    @keyframes bh-orb-drift2{
      0%{transform:translate(0,0) scale(1);}
      33%{transform:translate(-20px,18px) scale(.92);}
      66%{transform:translate(16px,-12px) scale(1.1);}
      100%{transform:translate(0,0) scale(1);}
    }
    .bh-fp__orb{
      position:absolute;z-index:0;border-radius:50%;pointer-events:none;
      background:rgb(var(--bh-accent-rgb));
      opacity:0;transition:opacity .8s,background-color .7s;
      /* Was blur(72px) on two continuously-animating (transform, infinite)
         420px circles — a lot of ongoing GPU compositing cost while the
         fullscreen player stays open, on top of the open-transition lag.
         40px keeps the glow look; will-change promotes each orb to its own
         layer so only the transform re-composites per frame, not the blur. */
      filter:blur(40px);
      will-change:transform;
    }
    #bh-fp.bh-fp--has-art .bh-fp__orb{opacity:.28;}
    #bh-fp-orb1{
      width:55vw;height:55vw;max-width:420px;max-height:420px;
      top:-10%;left:-8%;
      animation:bh-orb-drift 9s ease-in-out infinite;
    }
    #bh-fp-orb2{
      width:50vw;height:50vw;max-width:380px;max-height:380px;
      bottom:-8%;right:-6%;
      animation:bh-orb-drift2 11s ease-in-out infinite;
    }
    #bh-fp > *:not(#bh-fp-art-bg):not(.bh-fp__orb){position:relative;z-index:1;}
    .bh-fp__drag-bar{
      width:100%;padding:14px 0 6px;display:flex;justify-content:center;
      cursor:pointer;flex-shrink:0;touch-action:none;
    }
    .bh-fp__drag-handle{
      width:36px;height:4px;border-radius:2px;
      background:rgba(255,255,255,.22);
    }
    .bh-fp__header{
      width:100%;display:flex;align-items:center;justify-content:space-between;
      padding:0 20px 8px;box-sizing:border-box;flex-shrink:0;
    }
    .bh-fp__close-btn{
      width:44px;height:44px;display:flex;align-items:center;justify-content:center;
      border:none;background:rgba(255,255,255,.05);color:rgba(255,255,255,.55);
      cursor:pointer;border-radius:50%;-webkit-tap-highlight-color:transparent;
      transition:color .15s,background .15s;padding:0;
    }
    .bh-fp__close-btn:hover{color:#fff;background:rgba(255,255,255,.1);}
    .bh-fp__close-btn svg{width:20px;height:20px;pointer-events:none;}
    .bh-fp__hd-label{
      font:700 11px/1 'DM Mono',monospace;letter-spacing:.12em;text-transform:uppercase;
      color:rgba(255,255,255,.3);
    }
    .bh-fp__art-wrap{
      flex:0 0 auto;
      width:min(260px,calc(100vw - 72px));
      aspect-ratio:1;
      border-radius:18px;overflow:hidden;
      box-shadow:0 24px 64px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.07);
      margin:6px 0 22px;
      position:relative;
    }
    /* Blurred fill of the SAME cover behind the artwork: a non-square beat cover
       (YouTube 16:9 fallback, portrait uploads) now shows IN FULL via object-fit
       :contain, and the leftover bars become an ambient blur of the art instead of
       an aggressive crop (Spotify/Apple Music style). Square covers fully cover the
       ::before, so they look exactly as before — zero change for them. */
    .bh-fp__art-wrap::before{
      content:'';position:absolute;inset:0;
      background-image:var(--fp-cover,none);
      background-size:cover;background-position:center;
      filter:blur(18px) brightness(.72) saturate(1.4);
      transform:scale(1.25);
    }
    /* width/height !important + raised specificity: the FSE theme's `#main img{
       height:auto}` (specificity 1,0,1) otherwise beats plain `#bh-fp-art` (1,0,0),
       collapsing height→auto and making object-fit:contain inert — a non-square
       cover then top-aligns (16:9) or overflows/crops (portrait). Same #main gotcha
       the hero art (.bst-hero-v2__art-img) already guards with !important. */
    #bh-fp .bh-fp__art-wrap #bh-fp-art{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:contain;display:block;}
    .bh-fp__info{
      width:100%;padding:0 28px;box-sizing:border-box;
      display:flex;align-items:center;gap:14px;margin-bottom:20px;flex-shrink:0;
    }
    .bh-fp__info-text{flex:1;min-width:0;}
    #bh-fp-product-link{
      display:block;font:700 20px/1.25 'Manrope',system-ui,sans-serif;
      color:#f0edea;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      text-decoration:none;
    }
    #bh-fp-product-link:hover{color:var(--bh-accent-hi);}
    #bh-fp-artist{
      display:block;font:600 11px/1 'DM Mono',monospace;
      color:rgba(var(--bh-accent-rgb),.85);letter-spacing:.1em;text-transform:uppercase;
      margin-top:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
    .bh-fp__buy-btn{
      display:inline-flex;align-items:center;justify-content:center;
      flex-shrink:0;
      height:36px;padding:0 16px;border-radius:20px;
      background:rgba(var(--bh-accent-rgb),.15);border:1px solid rgba(var(--bh-accent-rgb),.3);
      color:var(--bh-accent-hi);font:700 11px/1 'Manrope',system-ui,sans-serif;letter-spacing:.04em;
      text-decoration:none;white-space:nowrap;
      transition:background .15s,border-color .15s,color .15s;cursor:pointer;
      -webkit-tap-highlight-color:transparent;
    }
    .bh-fp__buy-btn:hover{background:rgba(var(--bh-accent-rgb),.3);border-color:rgba(var(--bh-accent-rgb),.6);color:#fff;}
    .bh-fp__prog-wrap{
      width:100%;padding:0 24px;box-sizing:border-box;margin-bottom:10px;flex-shrink:0;
    }
    #bh-fp-progress{
      --_fill:0%;-webkit-appearance:none;appearance:none;
      width:100%;height:4px;border-radius:3px;
      background:linear-gradient(to right,var(--bh-accent) 0%,var(--bh-accent) var(--_fill),rgba(255,255,255,.12) var(--_fill),rgba(255,255,255,.12) 100%)!important;
      outline:none;cursor:pointer;margin:0 0 8px;display:block;transition:height .15s;
    }
    #bh-fp-progress:hover,#bh-fp-progress:focus{height:6px;}
    #bh-fp-progress::-webkit-slider-thumb{-webkit-appearance:none;width:0;height:0;}
    #bh-fp-progress:hover::-webkit-slider-thumb{
      width:14px;height:14px;-webkit-appearance:none;border-radius:50%;
      background:#fff;margin-top:-4px;box-shadow:0 0 12px rgba(var(--bh-accent-rgb),.7);
    }
    #bh-fp-progress::-moz-range-thumb{width:0;height:0;border:none;background:transparent;}
    #bh-fp-progress:hover::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:none;}
    .bh-fp__times{display:flex;justify-content:space-between;padding:0 2px;}
    #bh-fp-time-cur{font:600 11px/1 'DM Mono',monospace;color:var(--bh-accent-hi);}
    #bh-fp-time-rem{font:600 11px/1 'DM Mono',monospace;color:rgba(255,255,255,.3);}
    .bh-fp__controls{
      display:flex;align-items:center;justify-content:center;gap:16px;
      width:100%;padding:0 24px;box-sizing:border-box;flex-shrink:0;margin-bottom:18px;
    }
    .bh-fp__ctrl{
      display:flex;align-items:center;justify-content:center;
      border:none!important;background:transparent!important;
      color:rgba(240,237,234,.6);cursor:pointer;padding:0;border-radius:50%!important;
      transition:color .15s,transform .13s;box-shadow:none!important;
      -webkit-tap-highlight-color:transparent;
    }
    .bh-fp__ctrl:hover{color:#fff!important;transform:scale(1.08);}
    .bh-fp__ctrl:active{transform:scale(.88)!important;}
    .bh-fp__ctrl--prev,.bh-fp__ctrl--next{width:52px;height:52px;min-width:52px;}
    .bh-fp__ctrl--prev svg,.bh-fp__ctrl--next svg{width:28px;height:28px;pointer-events:none;}
    .bh-fp__ctrl--play{
      width:72px;height:72px;min-width:72px;border-radius:50%!important;
      background:var(--bh-accent)!important;color:#fff!important;
      box-shadow:0 8px 32px rgba(var(--bh-accent-rgb),.55)!important;
      transition:background .15s,box-shadow .2s,transform .13s!important;
    }
    .bh-fp__ctrl--play:hover{
      background:var(--bh-accent-hi)!important;
      box-shadow:0 0 0 14px rgba(var(--bh-accent-rgb),.1),0 10px 40px rgba(var(--bh-accent-rgb),.65)!important;
      transform:scale(1.05)!important;
    }
    .bh-fp__ctrl--play:active{transform:scale(.9)!important;}
    .bh-fp__ctrl--play svg{width:30px;height:30px;pointer-events:none;}
    .bh-fp__icon-pause{display:none;}
    .bh-fp__ctrl--play.is-playing .bh-fp__icon-play{display:none;}
    .bh-fp__ctrl--play.is-playing .bh-fp__icon-pause{display:flex;}
    .bh-fp__ctrl--play.is-loading{pointer-events:none;position:relative;}
    .bh-fp__ctrl--play.is-loading .bh-fp__icon-play,.bh-fp__ctrl--play.is-loading .bh-fp__icon-pause{opacity:0;}
    .bh-fp__ctrl--play.is-loading::after{content:'';position:absolute;inset:0;margin:auto;width:24px;height:24px;border:2.5px solid rgba(var(--bh-accent-rgb),.25);border-top-color:var(--bh-accent-hi);border-radius:50%;animation:bh-spin .65s linear infinite;}
    /* vault glass player: expand chevron — consolidated below */

    /* ── Global persistent player bar ── */
    #bh-gp{
      position:fixed;bottom:0;left:0;right:0;z-index:9990;
      background:rgba(8,7,14,.97);
      border-top:1px solid rgba(var(--bh-accent-rgb),.15);
      backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
      box-shadow:0 -8px 32px rgba(0,0,0,.55);
      padding:0 16px;padding-bottom:env(safe-area-inset-bottom,0px);
      display:flex;align-items:center;gap:12px;
      height:68px;box-sizing:content-box;
    }
    #bh-gp[hidden]{display:none;}
    /* Global player: audio only — no visible bar on vault pages */
    #bh-gp[data-audio-only="1"]{
      position:fixed !important;
      width:1px !important;height:1px !important;
      overflow:hidden !important;opacity:0 !important;
      pointer-events:none !important;
      bottom:-100px !important;left:-100px !important;
    }
    .bh-gp__art{
      /* width/height/object-fit !important + aspect-ratio: same theme-reset guard
         the vault cover uses. `body.beatshouse-theme img{height:auto}` (0,1,2)
         outspecifies a single-class rule and collapsed this to the cover's native
         aspect (16:9 → a 44x25 sliver, portrait → 44x78), making object-fit inert.
         Force the square so the crop matches the vault cover exactly. */
      flex:0 0 44px;width:44px!important;height:44px!important;aspect-ratio:1/1;
      border-radius:8px;object-fit:cover!important;object-position:center;
      background:linear-gradient(145deg,#1a1430,#0d0c18);
    }
    .bh-gp__meta{min-width:0;flex:1 1 auto;overflow:hidden;}
    .bh-gp__title{
      display:block;font:700 13px/1.2 'Manrope',system-ui,sans-serif;
      color:#f0edea;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
    .bh-gp__artist{
      display:block;font:500 11px/1.2 'Manrope',system-ui,sans-serif;
      color:rgba(240,237,234,.45);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      margin-top:3px;
    }
    .bh-gp__controls{display:flex;align-items:center;gap:4px;flex-shrink:0;}
    .bh-gp__btn{
      display:flex;align-items:center;justify-content:center;
      width:38px;height:38px;border-radius:50%;
      border:0;background:transparent;color:rgba(240,237,234,.7);
      cursor:pointer;transition:color .16s,background .16s;
      -webkit-tap-highlight-color:transparent;
    }
    .bh-gp__btn:hover{color:#fff;background:rgba(255,255,255,.08);}
    .bh-gp__btn--play{
      width:44px;height:44px;border-radius:50%;
      background:rgba(var(--bh-accent-rgb),.15);border:1px solid rgba(var(--bh-accent-rgb),.3);
      color:var(--bh-accent-hi);
    }
    .bh-gp__btn--play:hover{background:rgba(var(--bh-accent-rgb),.28);border-color:rgba(var(--bh-accent-rgb),.5);color:#fff;}
    .bh-gp__btn svg{width:16px;height:16px;pointer-events:none;}
    .bh-gp__btn--play svg{width:18px;height:18px;}
    @keyframes bh-spin{to{transform:rotate(360deg)}}
    .bh-gp__btn--play.is-loading{pointer-events:none;position:relative;}
    .bh-gp__btn--play.is-loading::after{content:'';position:absolute;inset:0;margin:auto;width:16px;height:16px;border:2px solid rgba(var(--bh-accent-rgb),.25);border-top-color:var(--bh-accent-hi);border-radius:50%;animation:bh-spin .65s linear infinite;}
    .bh-gp__progress{
      flex:0 1 180px;height:4px;border-radius:999px;
      background:rgba(255,255,255,.1);cursor:pointer;position:relative;overflow:hidden;
    }
    @media(max-width:480px){.bh-gp__progress{display:none;}}
    #bh-gp-fill{position:absolute;left:0;top:0;bottom:0;background:var(--bh-accent);width:0;transition:width .25s linear;}
    .bh-gp__time{font:500 10px/1 'DM Mono',monospace;color:rgba(240,237,234,.3);white-space:nowrap;flex-shrink:0;}
    @media(max-width:560px){.bh-gp__time{display:none;}}

    /* ════════════════════════════════════
       Vault glass player  (#bh-vault-player)
       ════════════════════════════════════ */
    @keyframes bhVpSlide{
      from{opacity:0;transform:translateX(-50%) translateY(18px);}
      to  {opacity:1;transform:translateX(-50%) translateY(0);}
    }
    @keyframes bhVpEq{
      0%,100%{height:3px;}40%{height:13px;}
    }
    @keyframes bhVpPlayPulse{
      0%,100%{box-shadow:0 6px 28px rgba(var(--bh-accent-rgb),.55)!important;}
      50%{box-shadow:0 6px 36px rgba(var(--bh-accent-rgb),.9),0 0 0 10px rgba(var(--bh-accent-rgb),.14)!important;}
    }
    @keyframes bhVpArtGlow{
      0%,100%{box-shadow:0 0 0 1px rgba(var(--bh-accent-rgb),.3),0 6px 20px rgba(0,0,0,.6);}
      50%{box-shadow:0 0 0 2px rgba(var(--bh-accent-rgb),.6),0 0 18px rgba(var(--bh-accent-rgb),.3),0 6px 20px rgba(0,0,0,.6);}
    }
    #bh-vault-player{
      --vp-accent:var(--bh-accent);--vp-accent-hi:var(--bh-accent-hi);
      --vp-text:#F0EDEA;--vp-muted:rgba(240,237,234,.42);
      --vp-track-bg:rgba(255,255,255,.1);
      position:fixed;left:50%;transform:translateX(-50%);
      bottom:16px;z-index:9980;
      /* Redesign: a thin one-row capsule, not a padded rectangular card —
         cover/title/play all sit directly on one flex line, pill-shaped
         (border-radius:999px) so nothing reads as "a box". */
      display:flex;align-items:center;gap:10px;
      /* Wider capsule to give the bigger, comfortable touch targets below
         room to breathe. */
      width:min(280px,calc(100vw - 20px));
      padding:6px 16px 6px 6px;border-radius:999px;
      background:rgba(6,7,13,.9);
      backdrop-filter:blur(40px) saturate(180%);
      -webkit-backdrop-filter:blur(40px) saturate(180%);
      border:1px solid rgba(var(--bh-accent-rgb),.2);
      /* Liquid-glass sheen: the outer dark shadow (depth) PLUS a two-sided
         inset highlight (top-left bright / bottom-right soft) so the pill
         reads as a lit glass edge, not a flat dark chip — same trick as the
         reference liquid-glass component's layered box-shadow. */
      box-shadow:0 0 0 1px rgba(var(--bh-accent-rgb),.07),
                 0 14px 36px rgba(0,0,0,.65),
                 0 4px 14px rgba(0,0,0,.35),
                 inset 1.5px 1.5px 1px 0 rgba(255,255,255,.16),
                 inset -1px -1px 1px 1px rgba(255,255,255,.06);
      animation:bhVpSlide .32s cubic-bezier(.22,1,.36,1) both;
      /* Bouncy "squish" grow on hover/tap-hold — same overshoot easing as the
         reference component (cubic-bezier(.175,.885,.32,2.2)), applied to
         the whole capsule rather than just individual buttons. */
      transition:transform .5s cubic-bezier(.175,.885,.32,2.2),
                 padding .5s cubic-bezier(.175,.885,.32,2.2),
                 box-shadow .3s ease;
    }
    @media(hover:hover) and (pointer:fine){
      #bh-vault-player:hover{padding:7px 18px 7px 7px;}
    }
    /* Liquid-crystal layer — same feTurbulence/feDisplacementMap distortion the
       hero uses (#bh-glass-filter), sitting behind the real content (z-index:-1,
       within #bh-vault-player's own stacking context so it can't cover the
       controls) so the backdrop warps like liquid glass instead of a flat blur. */
    #bh-vault-player::after{
      content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
      /* Crisper/lighter blur (was 10px) — closer to the reference component's
         3px distortion pass, reads as sharper "warped glass" instead of a
         second layer of fog on top of the main 40px backdrop-blur. */
      backdrop-filter:blur(6px) saturate(160%);
      -webkit-backdrop-filter:blur(6px) saturate(160%);
      filter:url(#bh-glass-filter);
      opacity:.6;
    }
    /* Translucent white sheen (reference component's rgba(255,255,255,.25)
       tint layer) — kept subtle since BeatsHouse's theme is dark; a full-
       opacity white tint would clash with the site's near-black glass
       language everywhere else. */
    #bh-vault-player::before{
      content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
      background:rgba(255,255,255,.05);
    }
    #bh-vault-player[hidden]{display:none;}
    /* head — cover (corner avatar) + title, now just the leading segment of
       the one-row capsule instead of its own header row. */
    .bh-vp__head{display:flex;align-items:center;gap:9px;margin:0;flex:1;min-width:0;}
    .bh-vp__cover{
      /* height/object-fit !important — the theme reset `body.beatshouse-theme img{height:auto}`
         outspecifies a single-class rule and collapsed this to the image's native aspect
         (16:9 covers showed as a 72x41 sliver, portraits as 72x90). Force the square. */
      flex:0 0 44px;width:44px !important;height:44px !important;aspect-ratio:1/1;
      /* Circular corner avatar (was a rounded square) — "the image in a corner". */
      border-radius:50%;object-fit:cover !important;
      object-position:center;
      background:linear-gradient(145deg,#1e163a,#0d0c18);
      box-shadow:0 0 0 1px rgba(var(--bh-accent-rgb),.3),0 6px 20px rgba(0,0,0,.6);
      transition:box-shadow .4s ease,transform .5s cubic-bezier(.175,.885,.32,2.2);
    }
    @media(hover:hover) and (pointer:fine){
      /* !important: something elsewhere sets an inline style="transform:
         translate(0px,0px)" on this <img> (likely a lazy-load/GPU-hint
         script) — a non-!important stylesheet rule loses to ANY inline
         style regardless of :hover, so the scale silently never applied. */
      .bh-vp__cover:hover{transform:scale(1.08)!important;}
    }
    #bh-vault-player.is-playing .bh-vp__cover{
      animation:bhVpArtGlow 2.8s ease-in-out infinite;
    }
    .bh-vp__meta{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;}
    .bh-vp__title{
      display:block;font:700 12px/1.2 'Manrope',system-ui,sans-serif;
      color:var(--vp-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      text-decoration:none;
    }
    a.bh-vp__title:hover{color:var(--vp-accent-hi);}
    a.bh-vp__title[href="#"]{pointer-events:none;cursor:default;}
    /* Artist row + eq bars dropped from the thin capsule entirely (still exist
       in the DOM/markup, just hidden here) — one line of text only, reachable
       in full in the expanded #bh-fp view. */
    .bh-vp__artist-row{display:none;}
    /* expand / close buttons — dropped from the capsule row too (no room on
       a thin pill); still reachable via the cover/title tap-through in
       bh-global-player.js and via the full #bh-fp view. Kept in DOM, hidden
       here, so nothing in the JS wiring breaks. */
    /* Expand is dropped from the row entirely — tapping the cover triggers it
       instead (wired below), keeping the capsule to just cover/title/play.
       Close stays reachable but tucked as a tiny corner badge rather than a
       row item, so dismissing the player doesn't need its own row slot. */
    .bh-vp__expand-btn{display:none!important;}
    /* Bigger, comfortable close tap target (was 18px — too small to hit
       reliably and, at the old size/position, could clip the play button's
       tap area). Anchored top-LEFT over the cover instead of top-right over
       the play button, so a bigger badge has no risk of stealing play taps. */
    .bh-vp__icon-btn{
      position:absolute!important;top:-8px!important;left:-8px!important;right:auto!important;z-index:2!important;
      /* flex centering: without it the 12x12 svg sits on the inline baseline of the
         26x26 badge and reads as clipped/off-center. The FP close btn already flexes. */
      display:flex!important;align-items:center!important;justify-content:center!important;
      width:26px!important;height:26px!important;min-width:26px!important;min-height:26px!important;
      box-sizing:border-box!important;padding:0!important;margin:0!important;line-height:0!important;
      background:rgba(6,7,13,.96)!important;
      border:1px solid rgba(255,255,255,.14)!important;border-radius:50%!important;
      overflow:visible;flex-shrink:0;
    }
    .bh-vp__icon-btn svg{width:12px!important;height:12px!important;display:block!important;pointer-events:none;}
    .bh-vp__cover{cursor:pointer;}
    /* progress — dropped from the mini capsule (no visible row here); still
       fully present/functional in the expanded #bh-fp view. */
    .bh-vp__prog-wrap{display:none!important;}
    .bh-vp__progress{
      --_fill:0%;-webkit-appearance:none;appearance:none;
      width:100%;height:4px;border-radius:2px;
      box-sizing:border-box;padding:0;
      background:linear-gradient(to right,var(--vp-accent) 0%,var(--vp-accent) var(--_fill),var(--vp-track-bg) var(--_fill),var(--vp-track-bg) 100%)!important;
      outline:none;cursor:pointer;margin:0 0 5px;display:block;transition:height .18s;
    }
    .bh-vp__progress:hover{height:6px;}
    .bh-vp__progress::-webkit-slider-runnable-track{
      height:4px;border-radius:2px;background:transparent;
    }
    .bh-vp__progress:hover::-webkit-slider-runnable-track{height:6px;}
    .bh-vp__progress::-webkit-slider-thumb{
      -webkit-appearance:none;width:14px;height:14px;border-radius:50%;
      background:#fff;margin-top:-4.5px;
      box-shadow:0 0 10px rgba(var(--bh-accent-rgb),.65);
      opacity:0;transition:opacity .2s;
    }
    .bh-vp__progress:hover::-webkit-slider-thumb{opacity:1;}
    #bh-vault-player.is-playing .bh-vp__progress::-webkit-slider-thumb{opacity:.85;}
    .bh-vp__progress::-moz-range-track{height:4px;border-radius:2px;background:var(--vp-track-bg);}
    .bh-vp__progress::-moz-range-thumb{
      width:14px;height:14px;border-radius:50%;background:#fff;border:none;
      box-shadow:0 0 10px rgba(var(--bh-accent-rgb),.65);
      opacity:0;transition:opacity .2s;
    }
    .bh-vp__progress:hover::-moz-range-thumb{opacity:1;}
    #bh-vault-player.is-playing .bh-vp__progress::-moz-range-thumb{opacity:.85;}
    .bh-vp__progress::-moz-range-progress{height:4px;border-radius:2px;background:var(--vp-accent);}
    .bh-vp__times{display:flex;justify-content:space-between;margin-top:2px;}
    .bh-vp__time{font:600 9px/1 'DM Mono',monospace;color:var(--vp-accent-hi);}
    .bh-vp__time-rem{font:600 9px/1 'DM Mono',monospace;color:var(--vp-muted);}
    /* controls row — 3 zones: aux | transport (centered) | buy. No absolute
       positioning, so nothing overlaps / steals clicks regardless of width. */
    /* Trailing segment of the one-row capsule — just the play button now. */
    .bh-vp__controls{display:flex;align-items:center;gap:0;flex:0 0 auto;margin:0;padding:0;}
    /* Mini bar: strip to essentials (cover/title/progress/play + expand/close
       up top). Share/download/edit, prev/next and the buy chip only reappear
       in the expanded #bh-fp view — reachable via the expand button, still
       in the DOM (JS keeps working) just not taking up space here. */
    .bh-vp__aux,.bh-vp__ctrl--prev,.bh-vp__ctrl--next,.bh-vp__buy-chip{display:none!important;}
    .bh-vp__transport{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:center;gap:10px;}
    .bh-vp__share-btn{
      flex:0 0 auto;
      display:inline-flex;align-items:center;justify-content:center;
      width:26px;height:26px;border-radius:50%;
      border:1px solid rgba(255,255,255,.1)!important;background:rgba(255,255,255,.04)!important;
      color:rgba(240,237,234,.5);
      cursor:pointer;transition:color .15s,background .15s,border-color .15s,transform .12s;padding:0;
    }
    .bh-vp__share-btn:hover{color:#fff!important;background:rgba(255,255,255,.1)!important;border-color:rgba(255,255,255,.2)!important;}
    .bh-vp__share-btn:active{transform:scale(.92);}
    .bh-vp__share-btn svg{width:11px;height:11px;pointer-events:none;}
    #bh-vp-edit-btn[hidden]{display:none!important;}
    #bh-vp-edit-btn{color:#c9b6ff!important;border-color:rgba(var(--bh-accent-rgb),.32)!important;}
    .bh-vp__buy-chip{
      flex:0 0 auto;
      display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:13px;
      background:rgba(var(--bh-accent-rgb),.12);border:1px solid rgba(var(--bh-accent-rgb),.28);
      color:var(--bh-accent-hi);font:700 9px/1 'Manrope',system-ui,sans-serif;letter-spacing:.04em;
      text-decoration:none;white-space:nowrap;cursor:pointer;
      transition:background .15s,border-color .15s,color .15s;
      -webkit-tap-highlight-color:transparent;
    }
    .bh-vp__buy-chip:hover{background:rgba(var(--bh-accent-rgb),.25);border-color:rgba(var(--bh-accent-rgb),.5);color:#fff;}
    .bh-vp__buy-chip[href="#"]{display:none;}
    .bh-vp__ctrl{
      display:flex;align-items:center;justify-content:center;
      border:none!important;background:transparent!important;
      color:rgba(240,237,234,.6);cursor:pointer;padding:0;border-radius:50%!important;
      transition:color .15s,transform .13s;box-shadow:none!important;
    }
    .bh-vp__ctrl:hover{color:#fff!important;transform:scale(1.12);}
    .bh-vp__ctrl:active{transform:scale(.9);}
    .bh-vp__ctrl--prev,.bh-vp__ctrl--next{width:32px;height:32px;min-width:32px;}
    .bh-vp__ctrl--prev svg,.bh-vp__ctrl--next svg{width:16px;height:16px;pointer-events:none;}
    .bh-vp__ctrl--play{
      /* Was 38px — under the 44px accessibility-minimum tap target and, per
         user feedback, uncomfortable to hit reliably. */
      width:48px;height:48px;min-width:48px;border-radius:50%!important;
      background:var(--vp-accent)!important;color:#fff!important;
      box-shadow:0 6px 28px rgba(var(--bh-accent-rgb),.55)!important;
      /* Bouncy overshoot easing on transform, matching the reference
         liquid-glass component's hover-scale feel. */
      transition:background .15s,box-shadow .2s,transform .5s cubic-bezier(.175,.885,.32,2.2)!important;
    }
    @media(hover:hover) and (pointer:fine){
      .bh-vp__ctrl--play:hover{
        background:var(--vp-accent-hi)!important;
        box-shadow:0 0 0 8px rgba(var(--bh-accent-rgb),.12),0 8px 32px rgba(var(--bh-accent-rgb),.65)!important;
        transform:scale(1.1);
      }
    }
    .bh-vp__ctrl--play:active{transform:scale(.92);}
    .bh-vp__ctrl--play svg{width:20px;height:20px;pointer-events:none;}
    .bh-vp__icon-pause{display:none;}
    .bh-vp__ctrl--play.is-playing .bh-vp__icon-play{display:none;}
    .bh-vp__ctrl--play.is-playing .bh-vp__icon-pause{display:flex;}
    .bh-vp__ctrl--play.is-playing{
      animation:bhVpPlayPulse 2.8s ease-in-out infinite;
    }
    .bh-vp__ctrl--play.is-loading{pointer-events:none;position:relative;animation:none!important;}
    .bh-vp__ctrl--play.is-loading .bh-vp__icon-play,.bh-vp__ctrl--play.is-loading .bh-vp__icon-pause{opacity:0;}
    .bh-vp__ctrl--play.is-loading::after{content:'';position:absolute;inset:0;margin:auto;width:16px;height:16px;border:2.5px solid rgba(var(--bh-accent-rgb),.25);border-top-color:var(--bh-accent-hi);border-radius:50%;animation:bh-spin .65s linear infinite;}
    @media(max-width:480px){
      #bh-vault-player{bottom:calc(8px + env(safe-area-inset-bottom,0px));
        padding:5px 14px 5px 5px;
        width:min(250px,calc(100vw - 12px));}
      .bh-vp__cover{flex:0 0 40px;width:40px !important;height:40px !important;}
      /* Play stays at the 44px accessibility-minimum tap target even on the
         narrowest layout — it's the primary action, shouldn't be the
         smallest thing on the bar. */
      .bh-vp__ctrl--play{width:44px;height:44px;min-width:44px;}
      .bh-vp__icon-btn{top:-8px!important;left:-8px!important;}
    }
    /* Reserve scroll space below the floating player so it never permanently
       occludes page content (license cards, footer). The body.bh-vp-active class
       is toggled by bh-global-player.js show()/hide() when the player appears.
       Slim one-row capsule now — far shorter than the old stacked card. */
    body.bh-vp-active{padding-bottom:96px!important;} /* beats html,body{padding:0!important} reset */
    @media(max-width:480px){
      body.bh-vp-active{padding-bottom:86px!important;}
    }
    /* ── Album-art accent: motion polish (JS drives the tokens per track) ── */
    #bh-fp-orb1,#bh-fp-orb2{transition:background-color .7s ease;}
    #bh-gp-fill{transition:width .25s linear,background-color .5s ease;
      box-shadow:0 0 10px rgba(var(--bh-accent-rgb),.7),0 0 3px rgba(var(--bh-accent-rgb),.95);border-radius:0 2px 2px 0;}
    #bh-vault-player.is-playing .bh-vp__prog-wrap{filter:drop-shadow(0 0 5px rgba(var(--bh-accent-rgb),.4));}
    /* Directional nudge on prev/next — tactile, beats the flat scale */
    .bh-fp__ctrl--prev:active{transform:translateX(-4px) scale(.9)!important;}
    .bh-fp__ctrl--next:active{transform:translateX(4px) scale(.9)!important;}
    .bh-vp__ctrl--prev:active{transform:translateX(-3px) scale(.9)!important;}
    .bh-vp__ctrl--next:active{transform:translateX(3px) scale(.9)!important;}
    /* Artwork tilt GPU hints */
    .bh-fp__art-wrap{will-change:transform;}
    #bh-fp-art{will-change:transform;}
    @media (prefers-reduced-motion:reduce){.bh-fp__art-wrap,#bh-fp-art{will-change:auto;}}