/* A gentle, shared amber treatment for activity photographs. */
:root {
  --gallery-photo-filter: sepia(.22) saturate(.90) contrast(1.02);
  --gallery-photo-warmth: rgba(197, 132, 62, .10);
}
:is(.g-card, .field-media, .vl-media, .voice-media, .ah-p) > img,
.about-photo-mask,
.abt-photo {
  filter: var(--gallery-photo-filter);
}
:is(.g-card, .field-media, .vl-media, .voice-media, .ah-p):has(> img)::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
  background: var(--gallery-photo-warmth);
  mix-blend-mode: multiply;
  pointer-events: none;
}
/* Keep the treatment on the poster only when a video replaces the photograph. */
:is(.g-card, .field-media, .vl-media, .voice-media):has(> video, > iframe)::after { display: none; }
.about-photo-mask {
  background-color: var(--gallery-photo-warmth);
  background-blend-mode: multiply;
}
.site-media-sound.media-sound {
  position: absolute;
  inset: auto auto 12px 12px;
  z-index: 12;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 10px;
  margin: 0;
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 50%;
  background: rgba(49, 28, 17, .86);
  color: #fff;
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
  box-shadow: 0 2px 8px #0002;
}
.site-media-sound.media-sound[hidden] { display: none; }
.site-media-sound.media-sound svg { width: 22px; height: 22px; }
.site-media-sound.media-sound:hover { background: #431f10; }
.site-media-sound.media-sound:focus-visible { outline: 3px solid #f16a2c; outline-offset: 3px; }
:is(.field-media, .vl-media, .voice-media) > .site-media-sound { inset: 12px auto auto 12px; }
.field-item:not(.is-open) .site-media-sound { display: none; }
.g-card .site-media-sound { inset: auto auto 8px 8px; }
.ah-video-inner { position: relative; }
.site-media-fallback {
  position: absolute;
  z-index: 13;
  top: 12px;
  left: 12px;
  right: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fffaf3;
  color: #431f10;
  font: 600 15px/1.35 'Afek', Arial, sans-serif;
  text-align: center;
  text-decoration: underline;
}
.site-media-needs-play { pointer-events: auto !important; transform: none !important; }
/* An explicit sound request also exposes YouTube's own playback controls. */
iframe.site-media-audible {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  transform: none !important;
  pointer-events: auto !important;
}
@media (prefers-reduced-motion: reduce) {
  .site-media-sound { transition: none; }
}


/* The same explicit sound control is available in the hero carousel. */
.gallery3d .media-sound { display: inline-flex !important; }