/* DiagnostiX v314 — smartphone-only Safari/Chrome browser chrome backdrop.
   Keeps the top and bottom viewport expansion areas identical to the active app screen. */
@media (max-width: 767px) {
  html.dx-v303-mobile-html,
  body.dx-v303-mobile {
    background-color: var(--dx309-active-bg, #081018) !important;
    background-image: none !important;
    color-scheme: dark !important;
  }

  /* Safari and Chrome briefly reveal space outside visualViewport while their
     tab/address bars collapse or expand. This fixed underlay follows the active
     screen color and extends beyond both edges, so no white browser canvas can
     become visible during that transition. */
  body.dx-v303-mobile::before {
    content: "";
    position: fixed;
    top: -320px;
    right: -96px;
    bottom: -320px;
    left: -96px;
    z-index: 2147481500;
    display: block;
    background: var(--dx309-active-bg, #081018) !important;
    pointer-events: none;
    transform: translateZ(0);
    will-change: background-color;
  }

  #dxAndroidExactAppV303 {
    z-index: 2147482000;
    background-color: var(--dx307-active-bg, #081018) !important;
  }
}