/* V286: tablet-specific game layout. Phone (<801px) and desktop (>1200px) unchanged. */
@media (min-width:801px) and (max-width:1200px), (min-width:801px) and (max-width:1400px) and (pointer:coarse) {
  body.board-view .board-wrap,
  body.board-view:not(.classic-mode) .board-wrap,
  body.board-view.pawn-status-hidden .board-wrap,
  body.board-view:not(.classic-mode):not(.pawn-status-hidden) .board-wrap {
    --board-side: min(calc(100dvh - 112px),calc(100vw - 258px));
    width:100%!important;max-width:100%!important;min-width:0!important;
    min-height:100dvh!important;height:auto!important;
    display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;
    justify-content:center!important;align-items:center!important;
    gap:12px!important;padding:64px 12px 16px!important;
    overflow:auto!important;box-sizing:border-box!important;
  }
  body.board-view:not(.classic-mode):not(.pawn-status-hidden) .board-wrap {
    --board-side:min(calc(100dvh - 112px),calc(100vw - 416px));
    padding-left:196px!important;
  }
  body.board-view canvas#board,
  body.classic-mode.board-view canvas#board,
  body.board-view.pawn-status-hidden canvas#board,
  body.board-view:not(.classic-mode):not(.pawn-status-hidden) canvas#board {
    order:0!important;position:relative!important;inset:auto!important;
    width:var(--board-side)!important;height:var(--board-side)!important;
    max-width:var(--board-side)!important;max-height:var(--board-side)!important;
    flex:0 0 auto!important;margin:0!important;
  }
  body.board-view .playbar,
  body.board-view:not(.classic-mode):not(.pawn-status-hidden) .playbar {
    order:1!important;position:static!important;inset:auto!important;
    width:164px!important;max-width:164px!important;flex:0 0 164px!important;
    display:flex!important;flex-direction:column!important;gap:9px!important;
    padding:10px!important;margin:0!important;align-self:center!important;
  }
  body.board-view .playbar .die {width:56px!important;height:56px!important;font-size:29px!important;}
  body.board-view .playbar #rollBtn {min-height:46px!important;font-size:15px!important;}
  body.board-view:not(.classic-mode):not(.pawn-status-hidden) .expanded-pawn-status {
    left:8px!important;top:74px!important;width:174px!important;max-width:174px!important;
    max-height:calc(100dvh - 95px)!important;
  }
}
/* Portrait tablets benefit from the phone's vertical composition, with a larger board. */
@media (min-width:801px) and (max-width:1200px) and (orientation:portrait) {
  body.board-view .board-wrap,
  body.board-view:not(.classic-mode) .board-wrap,
  body.board-view.pawn-status-hidden .board-wrap,
  body.board-view:not(.classic-mode):not(.pawn-status-hidden) .board-wrap {
    --board-side:min(calc(100vw - 32px),calc(100dvh - 275px),720px)!important;
    flex-direction:column!important;justify-content:flex-start!important;
    min-height:100dvh!important;padding:66px 16px 22px!important;
    gap:10px!important;overflow-y:auto!important;
  }
  body.board-view .playbar,
  body.board-view:not(.classic-mode):not(.pawn-status-hidden) .playbar {
    width:min(var(--board-side),720px)!important;max-width:100%!important;flex:0 0 auto!important;
    display:grid!important;grid-template-columns:1fr auto 1fr!important;align-items:center!important;
    gap:10px!important;order:1!important;
  }
  body.board-view .playbar .dice {order:1!important;}
  body.board-view .playbar #rollBtn {order:0!important;}
  body.board-view .playbar #skipBtn {order:2!important;}
  body.board-view:not(.classic-mode):not(.pawn-status-hidden) .expanded-pawn-status {
    position:relative!important;inset:auto!important;transform:none!important;
    order:2!important;width:min(var(--board-side),720px)!important;max-width:100%!important;
    max-height:none!important;
  }
}