#loader {
  animation: loader 5s cubic-bezier(0.8, 0, 0.2, 1) infinite;
  height: 80px; /* Increased height */
  width: 82px;  /* Increased width */
  position: absolute;
  top: calc(50% - 40px); /* Adjusted to center the larger loader */
  left: calc(50% - 40px); /* Adjusted to center the larger loader */
}

@keyframes loader {
  90% { transform: rotate(0deg); }
  100% { transform: rotate(180deg); }
}

#top {
  animation: top 5s linear infinite;
  border-top: 40px solid var(--green); /* Increased border size */
  border-right: 40px solid transparent; /* Increased border size */
  border-left: 40px solid transparent; /* Increased border size */
  width: 2px; /* Increased width */
  transform-origin: 50% 100%;
}

#bottom {
  animation: bottom 5s linear infinite;
  border-right: 40px solid transparent;
  border-bottom: 40px solid var(--green);
  border-left: 40px solid transparent;
  width: 2px;
  transform: scale(0);
  transform-origin: 50% 100%;
}

@keyframes bottom {
  10% { transform: scale(0); }
  90% { transform: scale(1); }
  100% { transform: scale(1); }
}

#line {
  animation: line 5s linear infinite;
  border-left: 1px dotted var(--green);
  position: absolute;
  top: 40px;
  left: 39.5px;
}

@keyframes line {
  10% { height: 40px; }
  100% { height: 40px; }
}