confused about scoping rules in the functions [duplicate]

I have just decided to learn the programming concept of javascript. And I can’t skip the parts which i dont understand while im learning something.

I was reading this page and trying to understand difference between var and let; https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let

After the read the scoping rules part, i have run those two code blocks;

function x() {
    var x = 5;
    {
        var x = 6;
        console.log("inner: " + x);
    }
    console.log("outer: " + x);
}

x();

The output was;

inner: 6
outer: 6

But in the this version;

function x() {
    var x = 5;
    function y() {
        var x = 6;
        console.log("inner: " + x);
    }
    y();
    console.log("outer: " + x);
}

x();

The output was;

inner: 6
outer: 5

Im just wondering which language concept causes this difference? In the both code, { } and function y() are in the function x() scope. Isnt it? What am i missing?