/* Global sound control (header speaker) + the first-visit prompt. The only sound control on the page. */
.llsnd-grp { display: inline-flex; align-items: center; gap: 4px; }
.llsnd { flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; margin-right: 8px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--ink); cursor: pointer; transition: background-color var(--d-quick) var(--ease-out); }
.llsnd svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.llsnd svg path:first-child { fill: currentColor; }
.llsnd:hover { background: var(--cotton); }
.llsnd[aria-pressed="true"] { color: var(--ink); }
.llsnd[aria-pressed="true"] .w { stroke: var(--green); }
.llsnd:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
.llsnd-ask { position: fixed; z-index: 90; left: 50%; bottom: 24px; display: flex; align-items: center; gap: 12px; padding: 8px 44px 8px 16px; background: var(--white); border: 2px solid var(--ink); border-radius: var(--r-pill); box-shadow: var(--sh-widget); translate: -50% 12px; opacity: 0; transition: opacity var(--d-base) var(--ease-out), translate var(--d-base) var(--ease-out); max-width: calc(100vw - 32px); }
.llsnd-ask.is-in { opacity: 1; translate: -50% 0; }
.llsnd-ask p { margin: 0; font: 700 14px/1.3 var(--text); white-space: nowrap; }
.llsnd-ask__b { display: flex; gap: 6px; }
.llsnd-ask .btn--sm { min-height: 36px; padding: 0 14px; font-size: 14px; white-space: nowrap; }
.llsnd-ask__x { position: absolute; right: 4px; top: 50%; translate: 0 -50%; width: 36px; height: 36px; border: 0; background: none; font: 400 22px/1 var(--text); color: var(--ink-2); cursor: pointer; border-radius: 50%; }
.llsnd-ask__x:hover { color: var(--ink); background: var(--cotton); }
.llsnd-ask button:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
/* phones: the same one-line bar, 16px from the edges and above the safe area */
.llsnd-ask.is-bar { left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); translate: 0 12px; gap: 6px; padding: 6px 36px 6px 12px; justify-content: space-between; border-radius: var(--r-widget); max-width: none; }
.llsnd-ask.is-bar.is-in { translate: 0 0; }
.llsnd-ask.is-bar p { font-size: 12.5px; white-space: nowrap; line-height: 1.2; letter-spacing: -.01em; }
.llsnd-ask.is-bar .llsnd-ask__b { gap: 4px; }
.llsnd-ask.is-bar .btn--sm { min-height: 36px; padding: 0 8px; font-size: 12.5px; }
.llsnd-ask.is-bar .llsnd-ask__x { width: 36px; height: 40px; right: 0; }
@media (max-width: 600px) {
  /* phones: no room in the top row, so the speaker sits at the end of the journey-bar row (44px hit area kept) */
  .llsnd { position: absolute; right: 6px; bottom: -7px; margin: 0; }
  .llsnd svg { width: 20px; height: 20px; }
  .journey { padding-right: 52px; }
}