html,
body {
  margin: 0;
  padding: 0;
}

body {
  width: 100vw;
  height: 100vh;
  /* overflow: hidden; */
  background: #000;
  image-rendering: pixelated;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
    Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 13px;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

#downloadOriginalContainer {
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: auto;
  right: auto;
  color: rgba(255, 255, 255, 0.3);
  background-color: rgba(0, 0, 0, 0.6);
  padding: 4px 8px;
  user-select: none;
  cursor: pointer;
}

#userCounterDisplayContainer {
  display: block;
  text-align: right;
  user-select: none;
}

#userCounterDisplay {
  display: inline-block;
  text-align: center;
  color: rgba(255, 255, 255, 0.5);
  background-color: rgba(0, 0, 0, 0.6);
  padding: 4px 8px;
  cursor: help;
}

.rainbow {
  /* -webkit-filter: hue-rotate(0deg); */
  filter: invert(0) brightness(76%) sepia(100%) saturate(10000%);
}

.rainbow-container {
  display: block;
  margin: 0 auto;
  position: relative;
  -webkit-filter: hue-rotate(260deg);
  /* width: 100%; */
  height: 100%;
  aspect-ratio: 1;
  /* filter: invert(0) brightness(50%) sepia(100%) saturate(10000%); */
}

.blur-max {
  filter: blur(87px) brightness(200%);
}

.blur-small {
  filter: blur(12px) brightness(130%);
}

.layer {
  display: block;
  position: absolute;
  z-index: 100;
  /* background-color: red; */
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.onlytop {
  bottom: auto;
  height: auto;
}

.lines {
  width: 100%;
  height: 100%;
  display: block;
  background: url("lines.png") repeat;
  opacity: 14%;
  image-rendering: pixelated;
}

.noise {
  width: 100%;
  height: 100%;
  display: block;
  background: url("noise.png") repeat;
  opacity: 70%;
  image-rendering: optimizeQuality;
}

#interactiveField {
  cursor: pointer;
  width: 100%;
  height: 100%;
  display: block;
  outline: none;
  border: 0;
  background: transparent;
}
