html, body {
   margin: 0;
   padding: 0;
   height: 100%;
   width: 100%;
   box-sizing: border-box;
   overflow: hidden;
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   -webkit-tap-highlight-color: rgba(0,0,0,0);
   touch-action: none;
}

@font-face {
   font-family: 'IBM Plex Mono';
   src: url('./libcore/ibm-plex-mono-cyrillic-500-normal.woff2') format('woff2');
   font-weight: 500;
   font-style: normal;
}

body {
   background-color: #000;
   position: relative;
   width: 100%;
   height: 100%;
}

.testtest {
   width: 100%;
   height: 100%;
   position: absolute;
   top: 0;
   left: 0;
}

.canvas-paper {
   position: absolute;
   z-index: 1;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   background-color: #dc9cef;
   touch-action: none;
}

.canvas-container {
   position: absolute;
   z-index: 2;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   pointer-events: none;
   touch-action: none;
}

canvas {
   image-rendering: pixelated;
   image-rendering: crisp-edges;
   width: 100% !important;
   height: 100% !important;
   border: none;
   touch-action: none;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

#redoverlay {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: #fff;
   z-index: 9999;
}

#bluecover {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: #999;
   z-index: 10000;
   cursor: pointer;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   color: #000;
   font-family: 'IBM Plex Mono', monospace;
   text-align: center;
   padding: 0;
   box-sizing: border-box;
}

.textbox {
   font-size: 1.15rem; 
   letter-spacing: 0.05rem;
   line-height: 1.3;
   transform: translateY(-10%);
   -webkit-font-smoothing: none;
   font-smooth: never;
   -moz-osx-font-smoothing: grayscale;
   text-rendering: geometricPrecision;
}

/* #blackcover {
   background-color: #fff;
   height: 100%;
   width: 100%;
   position: fixed;
   z-index: 9999;
   mix-blend-mode: difference;
} */