.br-game-options{display:grid;gap:10px;justify-items:stretch;max-width:26rem;margin-bottom:16px}
.br-game-options details{margin:0;border:0;padding:0}
.br-game-options :is(summary,button){box-sizing:border-box;width:100%;text-align:left;border-radius:10px;padding:12px 16px;display:flex;gap:.6em;align-items:center;font-weight:700}
.br-game-options summary{background:#e8efe7;border:1px solid #a1b7a7;cursor:pointer;list-style:none}
.br-game-options summary::-webkit-details-marker{display:none}
.br-game-options summary::after{content:"▸";margin-left:auto}
.br-game-options details[open] summary::after{content:"▾"}

.br-game-options > button {cursor:pointer;background:#1b5142;color:white;border:1px solid #1b5142}
.br-game-options > button.br-help {background:#e8efe7;color:#17392f;border-color:#a1b7a7}

/* Give play areas the flexible track and keep actions compact. */
#game-table .play-layout,
.br-arcade-layout,
.tycoon-play-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(190px, 22%, 250px) !important;
  gap: clamp(16px, 2vw, 32px) !important;
  align-items: start;
}

#game-table .play-layout {
  max-width: 1040px;
}

#game-table .play-layout > :is(.board-wrap, .number-board, .match-game) {
  width: 100% !important;
  max-width: 100% !important;
}

#game-table .play-layout > .match-game {
  margin-top: 0;
  min-width: 0;
}

.br-arcade-play {
  min-width: 0;
}

@media (max-width: 760px) {
  #game-table .play-layout,
  .br-arcade-layout,
  .tycoon-play-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}