/* LOCAL 2P: one stationary board, two permanent opposing command stations. */
#tabletopTopStation[hidden]{display:none!important}
#tabletopTopStation{display:none}
#startStepLocal:not([hidden]){
  max-height:min(70dvh,700px);
  overflow-y:auto;
  overscroll-behavior:contain;
  padding-right:4px;
}
#startStepLocal .civChoiceGrid{margin:7px 0}
#startStepLocal .cyberConsentNote{line-height:1.5}
#localExportKifuBtn[hidden]{display:none!important}
#roomMatchStatus:not([hidden]){font-weight:800}
@media(max-width:700px){
  #startStepLocal:not([hidden]){max-height:calc(100dvh - 110px)}
  #startStepLocal .civChoiceGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
  #startStepLocal .civChoice{min-height:48px;padding:5px}
  #startStepLocal .civChoice span{display:none}
  #startStepLocal .cyberField{margin:5px 0}
  #startStepLocal .civSummaryPanel{font-size:11px;max-height:130px;overflow-y:auto}
}

/* LOCAL 2P uses a printed reference sheet.
   The desktop rule-reference <details> occupies the same grid cell as
   the upper player's command station. Remove it from layout ONLY during
   a LOCAL 2P match; retain all help in AI, ROOM and tutorial modes.
   The selected-piece status and actual action/defense controls remain. */
body.paxLocalTabletop #ruleReferencePanel,
body.paxLocalTabletop #mobileRuleRefBtn,
body.paxLocalTabletop #mobileFormationHelpBtn{
  display:none!important;
}

/* Disable legacy rotation entirely. Only the top command station is fixed
   upside down; the entire board, page and bottom commands never rotate. */
body.paxLocalTabletop{
  overflow:hidden;
  overscroll-behavior:none;
}
body.paxLocalTabletop #app{
  display:block;
  box-sizing:border-box;
  width:100%;
  max-width:none;
  height:100dvh;
  min-height:0;
  padding:4px;
  margin:0;
  overflow:hidden;
  transform:none!important;
  animation:none!important;
}
body.paxLocalTabletop #app>section.panel{
  display:flex;
  flex-direction:column;
  box-sizing:border-box;
  height:100%;
  min-height:0;
  padding:4px 7px;
  overflow:hidden;
}
body.paxLocalTabletop #topbar{
  flex:0 0 auto;
  max-height:13dvh;
  overflow-y:auto;
  gap:2px 7px;
}
body.paxLocalTabletop .brandBadge,
body.paxLocalTabletop .brandTitle small,
body.paxLocalTabletop #newsPanel,
body.paxLocalTabletop .boardShell .legend,
body.paxLocalTabletop #roomMatchStatus+.small{display:none}
body.paxLocalTabletop .brandTitle{font-size:13px;line-height:1.1}
body.paxLocalTabletop #turnInfo{font-size:11px}
body.paxLocalTabletop #roomMatchStatus,
body.paxLocalTabletop #activeRulesetBadge{font-size:9px;margin:0}
body.paxLocalTabletop #topbar .controls{gap:2px}
body.paxLocalTabletop #topbar .controls button,
body.paxLocalTabletop #topbar .controls .linkButton{
  font-size:9px;min-height:25px;padding:3px 5px;
}
body.paxLocalTabletop #message{
  flex:0 0 auto;
  padding:2px;
  margin:1px 0 3px;
  font-size:10px;
  line-height:1.2;
}
body.paxLocalTabletop .boardArea{
  display:grid;
  flex:1 1 auto;
  min-height:0;
  min-width:0;
  width:100%;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:minmax(70px,22%) minmax(0,1fr) minmax(70px,22%);
  align-items:stretch;
  justify-items:stretch;
  gap:3px;
  overflow:hidden;
}
body.paxLocalTabletop #tabletopTopStation{
  display:block;
  grid-column:1;
  grid-row:1;
  box-sizing:border-box;
  min-width:0;
  min-height:0;
  height:100%;
  padding:0;
  border:2px solid #637d91;
  border-radius:7px;
  background:#f7fafb;
  overflow:hidden;
  opacity:.5;
  pointer-events:none;
}
body.paxLocalTabletop.tabletopTopActive #tabletopTopStation{
  opacity:1;
  pointer-events:auto;
  border-color:#137f94;
}
body.paxLocalTabletop .tabletopTopContent{
  box-sizing:border-box;
  height:100%;
  display:flex;
  flex-direction:column;
  padding:3px;
  transform:rotate(180deg);
}
body.paxLocalTabletop #tabletopTopNotice{
  flex:0 0 auto;
  padding:1px 5px;
  font-size:10px;
  font-weight:900;
  color:#176077;
}
body.paxLocalTabletop #tabletopTopControls{
  flex:1 1 auto;
  overflow-y:auto;
  min-height:0;
  overscroll-behavior:contain;
}
body.paxLocalTabletop .boardShell{
  grid-column:1;
  grid-row:2;
  justify-self:center;
  align-self:center;
  box-sizing:border-box;
  width:min(100%,54dvh,628px);
  max-width:100%;
  max-height:100%;
  padding:0;
  overflow:hidden;
}
body.paxLocalTabletop #coordsTop{
  display:grid;
  width:100%;
  min-width:0;
  font-size:9px;
}
body.paxLocalTabletop #boardLine{
  width:100%;
  grid-template-columns:25px minmax(0,1fr);
}
body.paxLocalTabletop #coordsTop{
  grid-template-columns:25px repeat(13,minmax(0,1fr))!important;
}
body.paxLocalTabletop #coordsLeft{
  width:25px;
  font-size:9px;
}
body.paxLocalTabletop #board{
  display:grid;
  width:100%;
  min-width:0;
}
body.paxLocalTabletop #stageSlot{
  display:block;
  grid-column:1;
  grid-row:3;
  box-sizing:border-box;
  width:100%;
  min-width:0;
  min-height:0;
  max-height:100%;
  max-width:none;
  height:100%;
  margin:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  border:2px solid #637d91;
  border-radius:7px;
  padding:3px;
  background:#f7fafb;
}
body.paxLocalTabletop:not(.tabletopTopActive) #stageSlot{border-color:#137f94}
body.paxLocalTabletop.tabletopTopActive #stageSlot{
  opacity:.5;
  pointer-events:none;
}
body.paxLocalTabletop #stageSlot .swapBlock{
  padding:3px 5px;
  border:0;
  background:transparent;
}
body.paxLocalTabletop #unitBlock #actionButtons{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:3px;
  margin:3px 0!important;
}
body.paxLocalTabletop #unitBlock #actionButtons .commandButton{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  padding:4px 2px;
  min-height:45px;
}
body.paxLocalTabletop #unitBlock #actionButtons .commandLabel{
  font-size:10px;text-align:center;
}
body.paxLocalTabletop #unitBlock #actionButtons .commandKey{width:22px;height:22px}
body.paxLocalTabletop #unitBlock #actionExitBtn,
body.paxLocalTabletop #unitBlock #actionSpecialBtn{grid-column:auto}
body.paxLocalTabletop #unitBlock #selectedInfo{padding:3px 5px;font-size:10px}
body.paxLocalTabletop #operationHeader{margin:1px}
body.paxLocalTabletop #operationHeader h2{font-size:13px}
body.paxLocalTabletop #unitBlock #unitPanel{border:0;background:none}
body.paxLocalTabletop #stageSlot button,
body.paxLocalTabletop #tabletopTopStation button,
body.paxLocalTabletop #board .cell{touch-action:manipulation}

/* Mirrored commands have no IDs by design: never duplicate the original game
   inputs or event bindings. Style through their command classes and roles. */
body.paxLocalTabletop .tabletopMirroredUnit{padding:2px 5px}
body.paxLocalTabletop .tabletopMirroredUnit [data-local-source-id="operationHeader"]{
  display:flex;justify-content:space-between;align-items:center;
}
body.paxLocalTabletop .tabletopMirroredUnit h2{
  font-size:13px;
  margin:2px 0;
}
body.paxLocalTabletop .tabletopMirroredUnit [data-local-source-id="selectedInfo"]{
  padding:3px 5px;
  font-size:10px;
  background:#fff;
  border:1px solid #cad7df;
  border-radius:4px;
}
body.paxLocalTabletop .tabletopMirroredUnit [data-local-source-id="actionButtons"]{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:3px;
  margin:3px 0!important;
}
body.paxLocalTabletop .tabletopMirroredUnit .commandButton{
  display:flex;
  flex-direction:column;
  gap:3px;
  align-items:center;
  justify-content:center;
  border:1px solid #9eafb9;
  border-radius:4px;
  background:#fafafa;
  color:#263644;
  min-height:45px;
  padding:4px 2px;
  font-size:10px;
  touch-action:manipulation;
}
body.paxLocalTabletop .tabletopMirroredUnit .commandButton:disabled{opacity:.45}
body.paxLocalTabletop .tabletopMirroredUnit .commandKey{
  display:grid;
  place-items:center;
  width:22px;height:22px;
  border:1px solid #acbac5;
  border-radius:4px;
  font-weight:900;
}
body.paxLocalTabletop .tabletopMirroredUnit .commandLabel{
  font-size:10px;
  text-align:center;
}
body.paxLocalTabletop .tabletopMirroredUnit .controls{
  display:flex;gap:5px;flex-wrap:wrap;
}
body.paxLocalTabletop .tabletopMirroredUnit .configChoices{
  display:flex;flex-wrap:wrap;gap:3px;
}
body.paxLocalTabletop .tabletopMirroredUnit .configChoice{cursor:pointer}
body.paxLocalTabletop .tabletopMirroredUnit button{
  touch-action:manipulation;
}
@media(max-width:700px){
  body.paxLocalTabletop .boardArea{
    grid-template-rows:minmax(72px,23%) minmax(0,1fr) minmax(72px,23%);
  }
  body.paxLocalTabletop #app>section.panel{padding:2px 4px}
  body.paxLocalTabletop #topbar{max-height:10dvh}
  body.paxLocalTabletop #topbar .controls button,
  body.paxLocalTabletop #topbar .controls .linkButton{font-size:8px;padding:2px}
  body.paxLocalTabletop .boardShell{width:min(100%,47dvh,628px)}
  body.paxLocalTabletop #unitBlock #actionButtons,
  body.paxLocalTabletop .tabletopMirroredUnit [data-local-source-id="actionButtons"]{grid-template-columns:repeat(3,minmax(0,1fr))}
}


/* PORTRAIT SUPPORT (tablet and phone).
   Do not trap the entire game in a 100dvh clipped box. The board keeps its
   fixed orientation, top and bottom players keep permanent opposing stations,
   and the page may scroll only if the device is too short to fit all three.
   This is scoped to LOCAL 2P; other modes retain their original layout. */
@media (orientation:portrait){
  body.paxLocalTabletop{
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior-y:contain;
  }
  body.paxLocalTabletop #app{
    height:auto;
    min-height:100dvh;
    overflow:visible;
    padding:4px;
  }
  body.paxLocalTabletop #app>section.panel{
    height:auto;
    min-height:calc(100dvh - 8px);
    overflow:visible;
    padding:4px;
  }
  body.paxLocalTabletop #topbar{
    max-height:none;
    overflow:visible;
  }
  body.paxLocalTabletop .boardArea{
    flex:1 0 auto;
    height:auto;
    min-height:0;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto auto;
    justify-items:stretch;
    align-items:stretch;
    gap:6px;
    overflow:visible;
  }
  body.paxLocalTabletop #tabletopTopStation,
  body.paxLocalTabletop #stageSlot{
    box-sizing:border-box;
    height:clamp(140px,20dvh,260px);
    min-height:140px;
    max-height:none;
    overflow:hidden;
  }
  body.paxLocalTabletop #tabletopTopControls,
  body.paxLocalTabletop #stageSlot{
    overscroll-behavior:contain;
  }
  body.paxLocalTabletop #stageSlot{
    overflow-y:auto;
    margin:0;
  }
  body.paxLocalTabletop .boardShell{
    grid-column:1;
    grid-row:2;
    justify-self:center;
    align-self:center;
    width:min(100%,628px);
    height:auto;
    max-height:none;
    max-width:100%;
    overflow:hidden;
  }
  body.paxLocalTabletop #boardLine,
  body.paxLocalTabletop #coordsTop{
    width:100%;
    min-width:0;
  }
  body.paxLocalTabletop #board{
    width:100%;
    min-width:0;
  }
}
@media (orientation:portrait) and (max-width:700px){
  body.paxLocalTabletop #topbar{max-height:none}
  body.paxLocalTabletop .boardArea{
    grid-template-rows:auto auto auto;
    gap:4px;
  }
  body.paxLocalTabletop #tabletopTopStation,
  body.paxLocalTabletop #stageSlot{
    height:clamp(138px,18dvh,195px);
    min-height:138px;
  }
  body.paxLocalTabletop .boardShell{
    width:min(100%,628px);
    max-height:none;
  }
  body.paxLocalTabletop #unitBlock #actionButtons,
  body.paxLocalTabletop .tabletopMirroredUnit [data-local-source-id="actionButtons"]{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}


/* Match the AI BATTLE board dimensions in portrait LOCAL 2P.
   The AI board uses width:100% with max-width:600px on tablets. Do not
   restrict board width by d(v)h: this squeezes formation/troop labels. */
@media (orientation:portrait){
  body.paxLocalTabletop .boardArea{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto auto auto!important;
    justify-items:stretch;
    align-items:stretch;
    overflow:visible!important;
    height:auto!important;
  }
  body.paxLocalTabletop #tabletopTopStation{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
  }
  body.paxLocalTabletop .boardShell{
    grid-column:1!important;
    grid-row:2!important;
    width:100%!important;
    max-width:600px!important;
    min-width:0!important;
    max-height:none!important;
    margin:0 auto!important;
    justify-self:center!important;
    overflow:visible!important;
  }
  body.paxLocalTabletop #boardLine,
  body.paxLocalTabletop #coordsTop,
  body.paxLocalTabletop #board{
    width:100%!important;
    min-width:0!important;
  }
  body.paxLocalTabletop #stageSlot{
    grid-column:1!important;
    grid-row:3!important;
    position:static!important;
    width:100%!important;
    max-width:none!important;
    max-height:none!important;
    min-width:0!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    visibility:visible!important;
    contain:none!important;
    filter:none!important;
    z-index:auto!important;
    justify-self:stretch!important;
  }
}
/* The contextual-operation extension is for single-player floating controls.
   Keep the two LOCAL 2P control stations anchored even during defense,
   movement targeting or other command states, in both orientations. */
body.paxLocalTabletop #stageSlot{
  position:static!important;
  visibility:visible!important;
  contain:none!important;
  filter:none!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  z-index:auto!important;
}
body.paxLocalTabletop.paxContextOperation #stageSlot,
body.paxLocalTabletop.paxContextOperation.paxContextTargeting #stageSlot,
body.paxLocalTabletop.paxContextOperation.paxCombatUiActive #stageSlot{
  position:static!important;
  width:100%!important;
  max-width:none!important;
  max-height:none!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  zoom:1!important;
  filter:none!important;
}


/* Preserve the same coordinate-gutter alignment as AI BATTLE. */
@media (orientation:portrait) and (min-width:701px){
  body.paxLocalTabletop #coordsTop{
    grid-template-columns:28px repeat(13,minmax(0,1fr))!important;
  }
}
@media (orientation:portrait) and (max-width:700px){
  body.paxLocalTabletop #coordsTop{
    grid-template-columns:20px repeat(13,minmax(0,1fr))!important;
  }
  body.paxLocalTabletop .boardShell{
    max-width:600px!important;
  }
}


/* NO-SCROLL LOCAL 2P: the battlefield, top station and bottom station are all
   available on the current tablet screen, even in portrait orientation.
   Preserve AI BATTLE board width (max 600px); share remaining height between
   the command stations rather than pushing the lower station below the fold. */
@media (orientation:portrait){
  body.paxLocalTabletop{
    height:100dvh;
    overflow:hidden!important;
    overscroll-behavior:none;
  }
  body.paxLocalTabletop #app{
    height:100dvh!important;
    min-height:0!important;
    overflow:hidden!important;
    display:block!important;
  }
  body.paxLocalTabletop #app>section.panel{
    height:100%!important;
    min-height:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
  }
  body.paxLocalTabletop #topbar{
    flex:0 0 auto!important;
    max-height:min(20dvh,148px)!important;
    overflow:hidden!important;
    gap:2px 8px!important;
  }
  body.paxLocalTabletop #topbar .controls{
    flex-wrap:wrap;
  }
  body.paxLocalTabletop .boardArea{
    display:grid!important;
    flex:1 1 0%!important;
    height:auto!important;
    min-height:0!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(85px,1fr) auto minmax(85px,1fr)!important;
    gap:3px!important;
    align-content:stretch!important;
    align-items:stretch!important;
    overflow:hidden!important;
  }
  body.paxLocalTabletop #tabletopTopStation{
    display:block;
    grid-column:1!important;
    grid-row:1!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    padding:2px;
    overflow:hidden!important;
  }
  body.paxLocalTabletop .boardShell{
    grid-column:1!important;
    grid-row:2!important;
    width:100%!important;
    max-width:600px!important;
    min-width:0!important;
    max-height:none!important;
    height:auto!important;
    justify-self:center!important;
    align-self:center!important;
    margin:0 auto!important;
    overflow:visible!important;
  }
  body.paxLocalTabletop #stageSlot{
    grid-column:1!important;
    grid-row:3!important;
    position:static!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    width:100%!important;
    overflow:hidden!important;
    margin:0!important;
    padding:2px!important;
  }
  body.paxLocalTabletop #tabletopTopControls{
    overflow:hidden!important;
  }
  body.paxLocalTabletop #unitBlock #actionButtons,
  body.paxLocalTabletop .tabletopMirroredUnit [data-local-source-id="actionButtons"]{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:3px!important;
  }
  body.paxLocalTabletop #unitBlock #actionButtons .commandButton,
  body.paxLocalTabletop .tabletopMirroredUnit .commandButton{
    min-height:32px!important;
    padding:3px 2px!important;
  }
  body.paxLocalTabletop .tabletopMirroredUnit{padding:1px 4px}
  body.paxLocalTabletop .tabletopTopContent{padding:1px 2px}
  body.paxLocalTabletop #operationHeader,
  body.paxLocalTabletop .tabletopMirroredUnit [data-local-source-id="operationHeader"]{
    margin:0!important;
  }
  body.paxLocalTabletop #selectedInfo,
  body.paxLocalTabletop .tabletopMirroredUnit [data-local-source-id="selectedInfo"]{
    padding:2px!important;
    margin:0!important;
    font-size:10px!important;
    line-height:1.15!important;
  }
}
/* On short devices the AI-sized board plus two full-height forms cannot
   physically fit. Keep both command stations onscreen and allow compact
   labels; never silently put the lower station offscreen. */
@media (orientation:portrait) and (max-height:850px){
  body.paxLocalTabletop #topbar{
    max-height:85px!important;
  }
  body.paxLocalTabletop .boardArea{
    grid-template-rows:minmax(68px,1fr) auto minmax(68px,1fr)!important;
  }
  body.paxLocalTabletop #unitBlock #actionButtons,
  body.paxLocalTabletop .tabletopMirroredUnit [data-local-source-id="actionButtons"]{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
  }
  body.paxLocalTabletop #unitBlock #actionButtons .commandButton,
  body.paxLocalTabletop .tabletopMirroredUnit .commandButton{
    min-height:31px!important;
  }
  body.paxLocalTabletop .tabletopMirroredUnit .commandLabel,
  body.paxLocalTabletop #unitBlock .commandLabel{
    font-size:8px!important;
  }
}


/* SELECTION DIALOGS: controls should be reachable without a nested scroll.
   A tiny viewport-fit helper scales the card only if it still exceeds the
   actual screen after compacting its spacing. */
#matchSetupModal #matchSetupCard.cyberCard,
#kifuConsentModal .cyberCard,
#turnOrderModal .cyberCard{
  max-height:none!important;
  overflow:visible!important;
}
#matchSetupModal #matchSetupCard.cyberCard{
  padding:clamp(7px,1.4dvh,16px)!important;
}
#matchSetupModal #matchSetupCard .cyberEyebrow{
  margin:0 0 2px!important;
  font-size:9px!important;
}
#matchSetupModal #matchSetupCard .cyberLogo{
  font-size:clamp(19px,3.1dvh,31px)!important;
  margin:0!important;
}
#matchSetupModal #startFlowProgress{
  margin:3px 0!important;
  font-size:10px!important;
  line-height:1.2!important;
}
#matchSetupModal #matchSetupCard .cyberSectionTitle{
  margin:6px 0 3px!important;
  font-size:10px!important;
}
#matchSetupModal #startStepMode:not([hidden]),
#matchSetupModal #startStepLocal:not([hidden]),
#matchSetupModal #startStepAi:not([hidden]),
#matchSetupModal #startStepRoom:not([hidden]),
#matchSetupModal #startStepTutorial:not([hidden]){
  max-height:none!important;
  overflow:visible!important;
  overscroll-behavior:none;
}
#matchSetupModal #startStepLocal .civChoiceGrid{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:4px!important;
  margin:3px 0!important;
}
#matchSetupModal #startStepLocal .civChoice{
  min-height:47px!important;
  padding:4px 3px!important;
  text-align:center!important;
  align-content:center!important;
  gap:1px!important;
}
#matchSetupModal #startStepLocal .civChoice span{
  display:none!important;
}
#matchSetupModal #startStepLocal .cyberField,
#matchSetupModal #startStepRoom .cyberField{
  margin:4px 0!important;
  gap:2px!important;
}
#matchSetupModal #startStepLocal .cyberConsentNote{
  margin:3px 0!important;
  line-height:1.25!important;
  font-size:10px!important;
}
#matchSetupModal #startStepLocal #localCivSummary,
#matchSetupModal #startStepAi #aiCivSummary,
#matchSetupModal #startStepRoom #roomCivSummary{
  margin:3px 0!important;
  padding:4px 6px!important;
  min-height:0!important;
  max-height:52px!important;
  overflow:hidden!important;
}
#matchSetupModal #matchSetupCard .startFlowActions{
  margin:5px 0 0!important;
}
#matchSetupModal #matchSetupCard .startFlowActions button{
  min-height:32px!important;
  padding:5px 7px!important;
}
#matchSetupModal #startStepMode .modeChoiceGrid{
  margin:4px 0!important;
  gap:4px!important;
}
#matchSetupModal #startStepMode .modeChoice{
  min-height:49px!important;
  padding:5px!important;
}
#matchSetupModal #startStepMode .rulesetChoiceGrid{
  margin:3px 0!important;
  gap:4px!important;
}
#matchSetupModal #startStepRoom .modeChoiceGrid{
  margin:3px 0!important;
  gap:4px!important;
}
#matchSetupModal #startStepRoom .modeChoice{
  min-height:45px!important;
  padding:4px!important;
}
@media(max-width:700px){
  #matchSetupModal #startStepLocal .civChoiceGrid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  #matchSetupModal #startStepLocal .civChoice{
    min-height:38px!important;
    padding:3px 2px!important;
  }
  #matchSetupModal #startStepLocal .cyberConsentNote{
    font-size:9px!important;
  }
  #matchSetupModal #startStepLocal #localOfflineStatus{
    display:none!important;
  }
  #matchSetupModal #startStepLocal #localCivSummary{
    max-height:35px!important;
    font-size:8px!important;
    line-height:1.1!important;
  }
}
@media(max-height:700px){
  #matchSetupModal #startStepLocal>.cyberConsentNote,
  #matchSetupModal #startStepLocal #localOfflineStatus{
    display:none!important;
  }
  #matchSetupModal #matchSetupCard .cyberLogo{
    font-size:19px!important;
  }
}


/* Compact multi-choice stages into the available panel height instead of
   opening another scroll box. The game uses the same controls/actions. */
body.paxLocalTabletop #configPanel,
body.paxLocalTabletop #postMovePanel,
body.paxLocalTabletop #specialAbilityPanel,
body.paxLocalTabletop #decision,
body.paxLocalTabletop #combatBox{
  margin-top:3px!important;
  padding:4px!important;
}
body.paxLocalTabletop #configPanel .configField{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr)!important;
  gap:3px!important;
  margin:3px 0!important;
}
body.paxLocalTabletop #configPanel .configFieldLabel{
  font-size:10px!important;
  padding:2px 0!important;
}
body.paxLocalTabletop #configPanel .configChoices{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:3px!important;
}
body.paxLocalTabletop #configPanel .configChoice{
  min-height:30px!important;
  padding:3px 1px!important;
  font-size:10px!important;
}
body.paxLocalTabletop #decision .controls,
body.paxLocalTabletop #postMovePanel{
  display:flex;
  flex-wrap:wrap;
  gap:4px!important;
}
body.paxLocalTabletop #decision button,
body.paxLocalTabletop #postMovePanel button,
body.paxLocalTabletop #configPanel button,
body.paxLocalTabletop #actionCancelRow button{
  min-height:31px!important;
  padding:4px 6px!important;
}
body.paxLocalTabletop #combatBox .diceArena{
  margin-top:3px!important;
  gap:4px!important;
}


/* IDENTICAL LOCAL 2P STATIONS: both panels must use the same command design.
   1P retains the canonical IDs. 2P is a clone whose IDs are replaced by
   data-local-source-id to avoid duplicate DOM IDs.
   Apply ALL visual rules to both through shared selectors rather than
   maintaining a separate, simplified 2P theme. The upper station alone keeps
   its fixed 180deg transform on .tabletopTopContent. */
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit){
  --cmd-accent:var(--civ-accent,#4f5b60);
  --cmd-accent-soft:color-mix(in srgb,var(--civ-accent,#4f5b60) 10%,var(--civ-panel-soft,#fafafa));
  --cmd-metal:var(--civ-metal,#878f93);
  --cmd-muted:var(--civ-muted,#697277);
  box-sizing:border-box;
  padding:2px 5px!important;
  border:0!important;
  background:transparent!important;
  color:var(--civ-ink,#25292b);
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
}
body.paxLocalTabletop :is(#tabletopTopStation,#stageSlot){
  background:var(--civ-panel-soft,#f7fafb)!important;
  border-color:var(--civ-line,#637d91);
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#unitPanel,[data-local-source-id="unitPanel"]){
  box-sizing:border-box;
  border:1px solid color-mix(in srgb,var(--cmd-metal) 42%,#bbb)!important;
  border-left:4px solid var(--cmd-accent)!important;
  border-radius:5px;
  background:linear-gradient(90deg,var(--cmd-accent-soft) 0 6px,var(--civ-panel-soft,#fafafa) 6px 100%)!important;
  box-shadow:0 3px 10px #00000010;
  padding:3px 5px!important;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#operationHeader,[data-local-source-id="operationHeader"]){
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  flex-wrap:wrap;
  gap:3px!important;
  margin:0 0 3px!important;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#operationHeader,[data-local-source-id="operationHeader"]) h2{
  display:flex;
  align-items:baseline;
  gap:4px;
  font-size:13px!important;
  font-weight:900;
  margin:0!important;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#operationHeader,[data-local-source-id="operationHeader"]) h2::after{
  content:attr(data-civ-label);
  font:800 9px/1 Consolas,monospace;
  letter-spacing:.09em;
  color:var(--cmd-muted);
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionHud,[data-local-source-id="actionHud"]){
  display:inline-flex!important;
  align-items:center;
  gap:4px;
  border:1px solid var(--cmd-metal)!important;
  border-radius:6px;
  background:var(--civ-panel-soft,#fafafa)!important;
  padding:3px 6px!important;
  margin:0!important;
  font:800 10px Consolas,monospace;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionHud,[data-local-source-id="actionHud"])::before{
  content:"ACTIONS";
  font:800 8px Consolas,monospace;
  color:var(--cmd-muted);
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionsInfo,[data-local-source-id="actionsInfo"]){
  display:inline;
  font:900 17px/1 Consolas,monospace;
  min-width:36px;
  text-align:center;
  color:var(--cmd-accent)!important;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#selectedInfo,[data-local-source-id="selectedInfo"]){
  position:relative;
  display:block;
  padding:3px 5px!important;
  margin:0 0 3px!important;
  background:var(--civ-panel-soft,#fff)!important;
  color:var(--civ-ink,#3d4549)!important;
  border:1px solid color-mix(in srgb,var(--cmd-metal) 34%,#d4d7d8)!important;
  border-radius:5px;
  font-size:10px!important;
  line-height:1.2!important;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#selectedInfo,[data-local-source-id="selectedInfo"])[data-unit-mark]::before{
  content:attr(data-unit-mark);
  display:inline-grid;
  place-items:center;
  min-width:22px;
  height:20px;
  margin-right:4px;
  border:1px solid var(--cmd-metal);
  border-radius:4px;
  background:var(--cmd-accent-soft);
  color:var(--cmd-accent);
  font:900 12px/1 system-ui,sans-serif;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionButtons,[data-local-source-id="actionButtons"]){
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:3px!important;
  margin:3px 0!important;
  padding:0!important;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionButtons,[data-local-source-id="actionButtons"]) .commandButton{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center;
  align-items:center;
  gap:3px!important;
  min-width:0;
  min-height:32px!important;
  padding:3px 2px!important;
  text-align:center!important;
  border:1px solid color-mix(in srgb,var(--civ-line,#9eafb9) 72%,#bbb)!important;
  border-radius:5px!important;
  background:linear-gradient(#fffdf8,color-mix(in srgb,var(--civ-panel,#fafafa) 72%,#fff))!important;
  color:var(--civ-ink,#263644)!important;
  box-shadow:inset 0 1px 0 #fff;
  font:800 10px/1.1 system-ui,sans-serif!important;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionButtons,[data-local-source-id="actionButtons"]) .commandButton:disabled{
  background:#f1f1f0!important;
  color:#929596!important;
  border-color:#d2d4d5!important;
  opacity:.62;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionButtons,[data-local-source-id="actionButtons"]) .commandButton.selected{
  border-color:var(--cmd-accent)!important;
  background:var(--cmd-accent-soft)!important;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionButtons,[data-local-source-id="actionButtons"]) .commandKey{
  display:grid!important;
  place-items:center;
  width:22px!important;
  height:22px!important;
  flex:0 0 auto;
  border:1px solid var(--cmd-metal)!important;
  border-radius:4px;
  background:#fffaf0!important;
  color:var(--cmd-accent)!important;
  font:900 12px/1 Consolas,monospace;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionButtons,[data-local-source-id="actionButtons"]) .commandLabel{
  font-size:10px!important;
  line-height:1.12!important;
  font-weight:850;
  text-align:center;
  letter-spacing:0;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) .configChoice.selected{
  border-color:var(--cmd-accent)!important;
  background:var(--cmd-accent-soft)!important;
  color:var(--civ-ink,#263644)!important;
}
body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) .configChoice:hover:not(:disabled){
  border-color:var(--cmd-accent)!important;
  background:var(--cmd-accent-soft)!important;
}
@media(orientation:portrait) and (max-height:850px){
  body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionButtons,[data-local-source-id="actionButtons"]){
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
  }
  body.paxLocalTabletop :is(#unitBlock,.tabletopMirroredUnit) :is(#actionButtons,[data-local-source-id="actionButtons"]) .commandLabel{
    font-size:8px!important;
  }
}
/* Deliberately keep the upper 180deg orientation on the STATION only.
   Never transform #app or #board during turns/defense. */