/* The browser owns its toolbar and keyboard. Fit only the visible viewport. */
html #root {
  position: fixed;
  top: var(--app-top, 0px);
  left: 0;
  width: 100%;
  height: var(--app-height, 100%);
  overflow: hidden;
}
@supports (height: 100svh) {
  html #root { height: var(--app-height, 100svh); }
}
@supports (height: 100dvh) {
  html #root { height: var(--app-height, 100dvh); }
}
/* React Native portals live outside #root. Keep their controls in the same frame. */
[aria-modal="true"] {
  top: var(--app-top, 0px) !important;
  bottom: auto !important;
  height: var(--app-height, 100dvh) !important;
}
/* Safari zooms focused controls below 16px, shifting navigation off-screen. */
input, textarea, select { font-size: max(16px, 1em) !important; }