body, html {
    margin: 0;
    padding: 0;
    overflow: hidden;
    height: 100%;
    background-color: #000;
}

#maze-canvas {
    display: block;
    width: 100%;
    height: 100%;
}

/* Pixel-perfect rendering styles (applied via JavaScript when needed) */
#maze-canvas.pixel-perfect {
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
    image-rendering: -webkit-optimize-contrast;
    -ms-interpolation-mode: nearest-neighbor;
}

#minimap-canvas {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 200px;
    height: 200px;
    background-color: rgba(0, 0, 0, 0.5);
    border: 1px solid #fff;
    display: none; /* Hidden by default */
}