/* R16 homepage-only opening sound control. */
#intro-sound {
  position: absolute;
  z-index: 8;
  top: max(10vh, calc(env(safe-area-inset-top, 0px) + 88px));
  left: max(16px, env(safe-area-inset-left, 0px));
  width: 48px;
  min-width: 48px;
  min-height: 48px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid rgba(214,249,222,.58);
  border-radius: 50%;
  color: #f1f8f4;
  background: rgba(4,13,10,.68);
  backdrop-filter: blur(10px);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
#intro-sound:hover { border-color: var(--green); background: rgba(4,13,10,.86); }
#intro-sound:focus-visible { outline: 2px solid var(--green); outline-offset: 4px; }
.intro-sound-icon { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.intro-sound-visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
#intro-sound.sound-blocked { animation: oscSoundBlockedPulse 1.15s ease-in-out infinite; border-color: var(--green); color: var(--green); }
@keyframes oscSoundBlockedPulse { 50% { box-shadow: 0 0 0 9px rgba(185,255,57,.13), 0 0 26px rgba(185,255,57,.42); transform: scale(1.06); } }
@media (prefers-reduced-motion: reduce) { #intro-sound { animation: none !important; } }

/* R16 viewport placement override: detach the button from the footer flex/grid layout. */
#intro #intro-sound {
  position: fixed !important;
  inset-block-start: max(88px, calc(10vh + env(safe-area-inset-top, 0px))) !important;
  inset-inline-start: max(16px, env(safe-area-inset-left, 0px)) !important;
  inset-block-end: auto !important;
  inset-inline-end: auto !important;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
  max-width: 48px !important;
  max-height: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: none !important;
  transform: none !important;
}
/* Keep the icon legible over bright footage despite later visual theme rules. */
#intro #intro-sound {
  color: #fff !important;
  background: rgba(4, 13, 10, .82) !important;
  border: 1px solid rgba(255, 255, 255, .88) !important;
}
#intro #intro-sound .intro-sound-icon {
  color: #fff !important;
  stroke: currentColor !important;
}

#intro #intro-sound .intro-sound-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Cancel legacy footer arrow and text-button spacing before any state transition. */
#intro #intro-sound::before,#intro #intro-sound::after{content:none!important;display:none!important}
#intro #intro-sound{gap:0!important;padding:0!important;line-height:0!important}
#intro #intro-sound .intro-sound-icon{display:block;flex:none;margin:0}