.title{
    font-family: "stevie-sans", sans-serif;
    font-weight: 200;
    color: rgb(17, 0, 253);
    font-size: 1.5em;
    text-decoration: none;
    justify-content: center;
    padding-top: 10px;
    display: flex;
   
    z-index: 100;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden; /* prevents scrolling */
}

canvas {
  width: 100vw;
  height: 100vh;
  display: block;
    cursor: url('/static/img/crosshair.png') 16 16,crosshair;
}

    .controls {
      position: fixed;
      top: 20px;
      left: 20px;
      z-index: 10;
      display: flex;
      gap: 10px;
    }

    button {
    font-family: "stevie-sans", sans-serif;
    font-weight: 200;
    color: rgb(17, 0, 253);
    font-size: 1.5em;
      padding: 10px 15px;
      font-size: 12px;
      border: 1px solid rgb(17, 0, 253);
      background: white;
        right: 0;

    }

    .message {
    font-family: "stevie-sans", sans-serif;
    font-weight: 200;
    color: rgb(17, 0, 253);
    font-size: 1.5em;
    position: fixed;
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(255, 255, 255, 0.8);
    padding: 10px 20px;
    border-radius: 5px;
    border: 1px solid rgb(17, 0, 253);
    display: none;
    z-index: 200;
    }