:root {
    --ruffle-blue: #37528c;
    --ruffle-orange: #ffad33;
}

/* General body styling */
body, html {
    margin: 0;
    padding: 0;
    height: 100% !important;  /* Ensure the body takes up the full viewport */
    background: var(--ruffle-blue);
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Ensure the container takes up the full viewport */
#container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    width: 100vw !important;
    height: 100vh !important;
    overflow:hidden;
}

/* Container for the Flash player and canvas */
#player-container {
    position: relative;
    flex-grow: 1;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden; /* Prevent any overflow */
}

/* Ensure the canvas takes up the full size of the container */
#player-container canvas {
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto; /* Adjust to keep proper scaling */
    touch-action: none; /* Disable touch actions */
    cursor: auto; /* Default cursor */
    display: block;
}