/* Reemplaza el estilo de #wall por esto: */
#wall {
    width: 100%;
    height: 100%;
    background: 
        radial-gradient(
            ellipse at center,
            #1a1a1a 0%,
            #000 100%
        ),
        url('assets/wall-texture.png') repeat;
    background-size: 200px 200px;
    position: relative;
    perspective: 1000px; /* ¡NUEVO: añade profundidad! */
}

/* Y modifica el agujero para que parezca más lejano */
#hole {
    width: 60px; /* Más pequeño */
    height: 60px;
    background: radial-gradient(circle, #000 40%, #222 100%);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: 
        translate(-50%, -50%) 
        translateZ(-100px); /* ¡NUEVO: lo empuja hacia atrás */
    cursor: pointer;
    border: 4px solid #333;
    box-shadow: 
        0 0 0 15px rgba(0,0,0,0.5),
        inset 0 0 40px rgba(0,0,0,0.9);
    transition: all 0.3s ease;
}

#hole:hover {
    transform: 
        translate(-50%, -50%) 
        translateZ(-80px); /* Se acerca un poco al hover */
    border-color: #666;
    box-shadow: 
        0 0 0 20px rgba(100,100,100,0.3),
        inset 0 0 50px rgba(50,50,50,0.9);
}