* {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    color: rgba(255, 255, 255, 0.87);
    background-color: #000000;
}

#app {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000000;
}

#game-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000000;
}

/* PC 屏幕：最大宽度 540px，两边黑边 */
@media (min-width: 768px) {
    #game-container {
        max-width: 540px;
        max-height: 100vh;
    }

    canvas {
        max-width: 540px !important;
        height: auto !important;
    }
}

/* 手机屏幕：全屏覆盖 */
@media (max-width: 767px) {
    #app {
        width: 100vw;
        height: 100vh;
    }

    #game-container {
        width: 100vw;
        height: 100vh;
    }
}