/* Listen again accordion (listen-again-accordion.js). Headings stay visible; groups collapsed on load. */
ul.hcr-la-list > li.hcr-la-hidden { display: none !important; }
ul.hcr-la-list > li.hcr-la-head {
  position: relative;
  min-height: 48px;
  display: flex;
  align-items: center;
  padding: 6px 48px 6px 0;
  border-bottom: 1px solid #D8DCE3;
  cursor: pointer;
}
ul.hcr-la-list > li.hcr-la-head > h2 { margin: 0 !important; line-height: 1.2 !important; }
/* The whole heading row is the button's tap area. */
ul.hcr-la-list > li.hcr-la-head > button.hcr-la-toggle {
  position: absolute; inset: 0; width: 100%; min-height: 48px;
  display: flex; align-items: center; justify-content: flex-end;
  padding: 0 6px 0 0; margin: 0; border: 0; border-radius: 8px;
  background: transparent; color: #2B2F36; cursor: pointer;
  -webkit-tap-highlight-color: rgba(47, 74, 99, 0.12);
}
ul.hcr-la-list > li.hcr-la-head > button.hcr-la-toggle:focus-visible { outline: 3px solid #1F2469; outline-offset: 2px; }
.hcr-la-chev { transition: transform 0.2s ease; flex: 0 0 auto; }
ul.hcr-la-list > li.hcr-la-head.is-open .hcr-la-chev { transform: rotate(180deg); }
.hcr-la-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Play catch-up: once playing, React swaps the button for a faded, disabled "Playing below" pill
   (the "white shadow"). Remove it entirely; only the audio player remains, full width. */
ul.hcr-la-list > li button[data-variant="secondary"][aria-pressed="true"] { display: none !important; }
ul.hcr-la-list > li div.flex.flex-col.gap-2:has(> button[aria-pressed="true"]):not(:has(> :not(button[aria-pressed="true"]))) { display: none !important; }
ul.hcr-la-list > li audio.w-full { display: block; width: 100% !important; margin-top: 4px; border-radius: 999px; }
