.board {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}
.terrain {
    width: 100%;
    background-color: red;
    box-sizing: border-box;
}

.terrain-row {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr; /* toutes les cellules même largeur */
}

.terrain-cell {
    aspect-ratio: 1 / 1; /* largeur = hauteur */
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid black;
}
.footer {
    width: 100%;
    background-color: gray;
    display: flex;
    flex-direction: column;
    
}

.topScore {
    flex: 1;
    display: flex;
    flex-direction: row;
}

.bottomScore {
    flex: 1;
    display: flex;
    flex-direction: row;
}

.centerFooter{
    flex:5;
    display: flex;
    flex-direction:row;
}
.scoreItem {
    flex: 1;
    border: 1px solid;
    aspect-ratio: 1 / 1;
}
.leftScore {
    flex:1;
    display:flex;
    flex-direction:column;
}

.rightScore {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.infos {
    flex:23;
    display: flex;
    flex-wrap:wrap;
}

.building {
    height: 100%;
    aspect-ratio: 1 / 1; 
    flex: 0 0 auto;
    background: lightblue;
    border: 1px solid black;
}

.turns {
    flex: 1;
    display: flex;
    flex-direction: row;
}

.turn {    
    flex: 1;
}

.infos-row{
    height:50%;
    width:100%;
    background-color:blue;
    display:flex;
    flex-direction:row;
}

.construction {
    flex:1;
}

.fields {
    height: 100%;
    aspect-ratio: 1 / 1; /* largeur = hauteur */
    flex: 0 0 auto;
    background: lightblue;
    border: 1px solid black;
}