body {
    display: grid;
    justify-content: center;
    gap: 5px;
}

h1 {
    text-align: center;
}

#progress-container {
  width: 100%; /* Or a fixed width like 400px */
  height: 20px; /* Height of the loading bar */
  background-color: #e0e0e0; /* Background color of the empty bar */
  border-radius: 5px; /* Rounded corners for the container */
  overflow: hidden; /* Ensures the inner bar stays within the rounded corners */
}

#progress-bar {
  width: 0%; /* Initial width, will be updated by JavaScript or inline style */
  height: 100%;
  background-color: #4CAF50; /* Color of the filled portion */
  border-radius: 5px; /* Rounded corners for the filled bar */
  transition: width 0.5s ease-in-out; /* Smooth transition for width changes */
}