:root {
    --color-bg: #69F7BE;
    --color-text-main: #000000;
    --color-primary: #FFFF00;
    --wrapper-height: 87vh;
    --image-max-width: 300px;
    --image-margin: 0rem;
    --font-family: "HK Grotesk";
    --font-family-header: "HK Grotesk";
  }
  
  /* Basic page style resets */
  * {
    box-sizing: border-box;
  }
  
  [hidden] {
    display: none !important;
  }
  
  body {
    font-family: HK Grotesk;
    background-color:black;
  }
  
  #editor {
      position: absolute;
      top: 70%;
      bottom: 0px;
      left: 0;
      right: 0px;
      z-index: 5;
      transition: all 0.25s ease-in-out; /* Smooth transition for size change */
  }
  
  #editor:hover {
      top: 0;
      height: 100%;
  }
  
  .ace_scrollbar::-webkit-scrollbar {
      height: 7px;
      width: 7px;
  }
  
  .ace_scrollbar::-webkit-scrollbar-track
  {
      box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
      background-color: #272822; /* Matches ace monokai */
      border-radius: 10px;
  }
  
  .ace_scrollbar::-webkit-scrollbar-thumb {
      background-color: darkgrey;
      outline: 1px solid slategrey;
      border-radius: 10px;
  }
  
  canvas{
    overflow:hidden;
    width:100%;
    height:100%;
  }