/* mobile.css - Applied only to screens 850px or smaller */

body {
    padding-bottom: 0;
}

#game-window {
    margin-top: 0;
    width: 100vw;
    height: 100vh;
    border: none;
    border-radius: 0;
    padding: 5px;
    box-sizing: border-box;
}

#canvas-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Make the canvas responsive */
canvas {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain; 
}

/* Shrink and reposition the left UI panel */
#left-panel {
    left: 5px;
    width: 100px; /* Thinner for mobile */
    gap: 8px;
}

.side-box {
    padding: 8px;
    gap: 6px;
}

.side-box h3 {
    font-size: 0.85rem;
}

.menu-btn, .deploy-btn {
    padding: 6px;
    font-size: 0.75rem;
}

/* Scale down the Main Menu */
#main-menu h1 {
    font-size: 2.5rem;
}

.mp-box {
    width: 90%;
    padding: 15px;
}

#log-container {
    display: none; /* Hide the text log on mobile to save screen space */
}