/* Keep the Android canvas/browser chrome black in both application themes. */
html[data-su-system-bars="black"] {
  background-color: #000000 !important;
  color-scheme: only dark !important;
}

/* Native inputs and the content keep the selected light/dark appearance. */
html[data-su-system-bars="black"] body {
  color-scheme: var(--su-content-color-scheme, only light);
  min-height: 100vh;
  min-height: 100svh;
}

/* Edge-to-edge TWA draws Android's light navigation buttons over web content.
   A black root canvas does not help when the fixed light footer covers it.
   Paint only the reported system inset, also in the native dialog top layer.
   Zero inset means zero painted height; the page's controls remain interactive. */
html[data-su-system-bars="black"]::after,
html[data-su-system-bars="black"] dialog:modal::after {
  content: "";
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: env(safe-area-inset-bottom, 0px);
  background: #000000;
  pointer-events: none;
  z-index: 2147483647;
}