#main-layout {
    display: grid;
    grid-template-columns: fit-content(5%) auto fit-content(5%);
    grid-template-rows: fit-content(5%) auto fit-content(5%);
    align-items: stretch;
    width: 100vw;
    height: 100vh;
}

#main-layout.west {
    width: 50vw;
}

#main-layout.nord {
    height: 50vh;
}

#panel-top {
    grid-column: 1/4;
    grid-row: 1/2;
}

#panel-left {
    grid-column: 1/2;
    grid-row: 2/3;
}

#panel-center {
    grid-column: 2/3;
    grid-row: 2/3;
    overflow: hidden;
}

#panel-right {
    grid-column: 3/4;
    grid-row: 2/4;
}

#panel-bottom {
    grid-column: 1/3;
    grid-row: 3/4;
}

#mainCanvasDiv {
    width: 100%;
    height: 100%;
    background-color: #2E353A;
    position: relative;
}

#mainCanvas {
    background-color: #2E353A;
    display: block;
    width: fit-content;
    height: fit-content;
    cursor: default;
}