index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>FUN</title>

      <!--
    <link
      rel="stylesheet"
      href="https://unpkg.com/leaflet@1.9.2/dist/leaflet.css"
    />

  --->
    <link rel="stylesheet" href="./leaflet-no-attr-min.css" />
  

   
    <style>
      *,
      :after,
      :before {
        box-sizing: border-box;
        padding: 0;
        margin: 0;
      }



      body,
      html,
      #map {
        cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='48' viewport='0 0 100 100' style='fill:black;font-size:24px;'><text y='50%'>💵</text></svg>")  16 0, auto;
        display: flex;
        width: 100%;
        height: 100%;
        overflow: hidden;
        background: #000;
        
      }



      .leaflet-tile {
        filter: hue-rotate(8deg) brightness(0.8) invert(0.8) grayscale(0.8);
      }

  
   

    </style>
    
   <!-- Make sure you put this AFTER Leaflet's CSS
 <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"
 integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
 crossorigin=""></script>
  -->
  <script src="./leaflet-no-attr.js"></script>


  </head>

  <body>
    <div id="map"></div>

    
    <script src="./script.js"></script>
  </body>
</html>