/* ============================================
   LAYOUT
   Main structural layout containers
   ============================================ */

/* Game layout wrapper */
.game-layout{
  width:100vw;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

/* Main container */
.container{
  padding:18px;
  flex:1;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
}

/* Mobile: allow vertical growth */
@media (max-width:768px){
  .container{
    padding:12px;
    height:auto;
    min-height:auto;
  }
}

/* Main content area: horizontal layout for board + office panel */
.main-content{
  display:flex;
  gap:16px;
  flex:1;
  min-height:0;
  overflow:hidden;
}

/* Order: office-panel à esquerda, board à direita */
.main-content .office-panel{
  order:1;
}

.main-content .board{
  order:2;
}

/* Responsive: vertical layout for mobile */
@media (max-width:768px){
  .main-content{
    flex-direction:column;
    gap:16px;
    min-height:auto;
    overflow:visible;
    align-items:center;
    flex:0 1 auto;
  }
}