/* v1069: keep call composition cheap while the camera decoder is active. */
body.call-fullscreen .call,
body.call-floating .call,
body.call-native-pip .call {
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}

.call .call-top,
.call .call-actions,
.call .premium-menu,
.call .call-tools,
.call .video-shell,
.call .group-video-tile,
.call .local-video,
.call .remote-video {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
  box-shadow: none !important;
}

.call .call-actions {
  background: rgba(10, 16, 28, .76) !important;
  border-color: rgba(255, 255, 255, .14) !important;
}

.call video {
  transform: translateZ(0);
  will-change: auto;
}

/* v1082 Real-Time Video Authority. Keep live media on simple compositor
   layers. Legacy luxury filters and nested shadows force Android WebView to
   re-rasterize every decoded frame, which competes directly with WebRTC's
   encoder/decoder and manifests as delayed, choppy motion. */
#call:not(.hidden) :is(#remote-video,#local-video,.group-video-tile video) {
  filter: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
}

/* Android Self-View Surface Authority. v1093 began using portrait camera
   textures. A number of vendor WebViews render those textures black when the
   small mirrored video is also forced into a translateZ/backface-hidden GPU
   layer. Keep remote video promoted, but let the local preview use the native
   video surface and a simple 2D mirror. */
html.android-media-runtime #call:not(.hidden) #local-video {
  transform: scaleX(-1) !important;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  contain: none !important;
}
html.android-media-runtime #call:not(.hidden).media-swapped #local-video,
html.android-media-runtime #call:not(.hidden) #local-video.no-mirror {
  transform: scaleX(1) !important;
}

#call:not(.hidden):not(.light-warm):not(.light-bright) .video-light {
  display: none !important;
}

html.runtime-constrained #call:not(.hidden) :is(.call-top,.call-actions,.premium-menu,.call-tools) {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}

.call.controls-hidden .call-actions,
.call.controls-hidden .call-top-tools {
  pointer-events: none !important;
}

/* A visible control must also be a hittable control. The call runtime uses
   `controls-hidden` as its single state flag; the former inverse-state
   selector never matched runtime state and left visible
   Android controls behind a pointer-events shield. Keep the final production
   layer aligned with the runtime contract and above live video surfaces. */
#call:not(.hidden):not(.controls-hidden) :is(.call-actions,.call-top-tools,.premium-menu,.call-reaction-dock,.call-reaction-picker) {
  pointer-events: auto !important;
}

#call:not(.hidden):not(.controls-hidden) :is(.call-actions,.call-top-tools,.premium-menu,.call-reaction-dock,.call-reaction-picker) button:not(:disabled) {
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

/* v1070 Rotation Transaction. Android may report several intermediate bounds
   for one physical turn. Freeze decorative layout motion during that short
   transaction while live video continues on its existing compositor layer. */
#call.layout-settling:not(.hidden),
#call.layout-settling:not(.hidden) :is(.call-top,.call-actions,.premium-menu,.call-tools,#local-video,#remote-video,.group-videos,.group-video-tile) {
  transition:none !important;
  animation:none !important;
}
#call.layout-settling:not(.hidden) :is(#local-video,#remote-video,.group-video-tile video) {
  transform:translateZ(0);
  filter:none !important;
}

/* Dialogs launched from Call Tools are body portals. They remain visible and
   tappable even though the underlying application shell is hidden during a
   full-screen call. */
body.call-fullscreen>.modal[data-overlay-active="true"],
body.call-native-pip>.modal[data-overlay-active="true"] {
  visibility:visible !important;
  pointer-events:auto !important;
}

@media (prefers-reduced-motion: reduce) {
  .call *, .call *::before, .call *::after {
    animation: none !important;
    transition-duration: .01ms !important;
  }
}

/* v1081 Group Header Proximity Authority. This final production layer
   overrides the older four-column/back-button experiments, including their
   child-level !important grid assignments. Group chat now follows the same
   three-cell contract as direct chat: avatar, identity and menu. */
html[data-design-authority="v1024"] body #community-chat-modal .community-chat-back {
  display: none !important;
}

html[data-design-authority="v1024"] body #community-chat-modal .chat-heading.community-chat-head {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 44px !important;
  grid-template-rows: 48px !important;
  align-items: center !important;
  justify-items: stretch !important;
  column-gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 7px 12px !important;
  box-sizing: border-box !important;
}

html[data-design-authority="v1024"] body #community-chat-modal .chat-heading.community-chat-head .community-chat-avatar {
  position: relative !important;
  inset: auto !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  justify-self: start !important;
  align-self: center !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  margin: 0 !important;
  transform: none !important;
}

html[data-design-authority="v1024"] body #community-chat-modal .chat-heading.community-chat-head .community-chat-identity {
  position: static !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  justify-self: stretch !important;
  align-self: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  transform: none !important;
}

html[data-design-authority="v1024"] body #community-chat-modal .chat-heading.community-chat-head .community-chat-identity :is(h2, span) {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  text-align: left !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-design-authority="v1024"] body #community-chat-modal .chat-heading.community-chat-head .community-chat-head-actions {
  position: static !important;
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: center !important;
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

html[data-design-authority="v1024"] body #community-chat-modal #community-chat-menu-button {
  display: grid !important;
  place-items: center !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  touch-action: manipulation !important;
}

/* Both popovers remain descendants of the active chat modal. This prevents
   the overlay manager from making them inert while retaining viewport-sized
   fixed positioning in Android WebView. */
html[data-design-authority="v1024"] body #community-chat-modal > #community-chat-menu[data-menu-open="true"] {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  z-index: 30200 !important;
}

html[data-design-authority="v1024"] body #community-chat-modal > #community-attachment-menu[data-attachment-open="true"] {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  z-index: 30300 !important;
}

@media (max-width: 390px) {
  html[data-design-authority="v1024"] body #community-chat-modal .chat-heading.community-chat-head {
    grid-template-columns: 42px minmax(0, 1fr) 42px !important;
    column-gap: 8px !important;
    padding-inline: 10px !important;
  }
  html[data-design-authority="v1024"] body #community-chat-modal .chat-heading.community-chat-head .community-chat-avatar {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
  }
  html[data-design-authority="v1024"] body #community-chat-modal .chat-heading.community-chat-head .community-chat-head-actions,
  html[data-design-authority="v1024"] body #community-chat-modal #community-chat-menu-button {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
  }
}