 :root {
  --app-height: 100vh;
  --app-width: 100vw;
  --app-background: linear-gradient(135deg, #123651, #0d5496, #346597, #3976b2);
}

html {
  min-height: 100%;
  background: var(--app-background);
}

body {
  min-height: 100vh;
  min-height: 100svh;
  min-height: var(--app-height, 100svh);
  background: var(--app-background);
  position: relative;
  z-index: 0 !important;
}

#background {
  min-height: 100vh;
  min-height: 100svh;
  min-height: var(--app-height, 100svh);
  height: auto !important;
  position: relative;
  overflow: hidden;
  z-index: 0 !important;
  isolation: isolate;
}

#background .ball {
  pointer-events: none;
}

@supports (-webkit-touch-callout: none) {
  html {
    height: -webkit-fill-available;
  }
}

@supports (-webkit-touch-callout: none) {
  body,
  #background {
    min-height: -webkit-fill-available;
  }
}

@supports (-webkit-touch-callout: none) {
  #background .ball {
    position: absolute !important;
  }
}
