body{
    margin:0;
    overflow:hidden;
    background:black;
    display:flex;
    justify-content:center;
    align-items:center;
    height:100vh;
}

/* CONTENEDOR */
#game{
    position:relative;
    width:100vw;
    height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
}

/* IMAGEN PRINCIPAL */
#scene{
    width:100vw;
    height:100vh;
    object-fit:contain;
}

/* ===== BOTONES ===== */
#choices{
    position:absolute;
    top:60%;
    left:50%;
    transform:translate(-50%,-50%);
    display:flex;
    gap:2vw;   /* espacio responsive */
}

/* BOTON PIXEL RESPONSIVE */
.pixelBtn{
    font-family:monospace;

    font-size:clamp(14px, 2vw, 32px);
    padding:clamp(8px, 2vw, 20px) clamp(25px, 6vw, 90px);

    background:#d9d9d9;
    color:black;

    border:4px solid black;
    cursor:pointer;

    box-shadow:
        inset -4px -4px 0 #9a9a9a,
        inset 4px 4px 0 #ffffff;
}

.pixelBtn:active{
    box-shadow:
        inset 4px 4px 0 #9a9a9a,
        inset -4px -4px 0 #ffffff;
}

/* ===== CARTA ===== */
#letterIcon{
    position:absolute;
    width:clamp(120px, 20vw, 300px);
    top:72%;
    left:50%;
    transform:translate(-50%,-50%);
    display:none;
    cursor:pointer;
    z-index:10;
}

/* ===== X ===== */
#closeLetter{
    position:absolute;
    width:clamp(60px, 12vw, 270px);
    top:15%;
    right:18%;
    display:none;
    cursor:pointer;
    z-index:20;
}