body {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* Full viewport height */
    background-color: #0e0d0d; /* Optional: Set a background color */
    overflow: hidden; /* Prevent scrolling */
}

.content {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Ensure no overflow */
}

.canvas-container {
    display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
    width: 100%;
    height: 100%;
    overflow: hidden; /* Ensure no overflow */
    border: 1px solid;
}

canvas {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    aspect-ratio: 16 / 9; /* Maintain the canvas aspect ratio */
    display: block;
    margin: auto; /* Center the canvas horizontally and vertically */
    object-fit: contain; /* Ensure the canvas fits within its container */
}