html {
  font-size: 100%;
  /* Faded-in by interop.ts once webfonts resolve, to avoid FOUT. */
  transition: opacity 0.1s ease-in;
  /* Without this, mobile browsers/WebViews can promote #scroll-container
     (see Layouts/Navbar.elm) to act as the page's root scroller and apply
     native rubber-band/pull-to-refresh translation to the whole view,
     dragging fixed-position navbar elements along with it. */
  overscroll-behavior-y: none;
}

body {
  font-family: 'Inter', sans-serif;
  font-display: swap;
  overflow-x: hidden;
  overscroll-behavior-y: none;
  -webkit-tap-highlight-color: transparent;
}

@media (max-width: 1199px) {
  * {
    scrollbar-width: none;
  }

  *::-webkit-scrollbar {
    display: none;
  }
}

/* Main app scroll region (see Layouts/Navbar.elm): no visible scrollbar at
   any viewport width, it's the primary content area of what reads as a
   native app. */
#scroll-container {
  scrollbar-width: none;
}

#scroll-container::-webkit-scrollbar {
  display: none;
}

/* Number inputs: hide native spinner controls; we render custom chevrons. */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}