/* Compact play surface: keep the board, actions, zones, and hand in view. */
.app-header:has(~ #arena:not([hidden])){height:62px;padding-top:0;padding-bottom:0}
.arena{padding:8px 18px 12px}
.game-toolbar{margin-bottom:8px;min-height:40px}
.game-toolbar h1{font-size:18px;margin:0}
.toolbar-controls{gap:9px}
.game-layout{display:block}
.board{height:clamp(260px,36svh,420px);min-height:260px}
.command-bar{min-height:64px;padding:8px 12px;gap:10px}
.command-copy h2{font-size:13px;margin:0}
.command-copy p{font-size:10px;line-height:1.4}
.command-actions button{padding:6px 10px}
.active-skill-bar{padding:7px 10px;margin-top:7px;border-radius:9px}
.active-skill-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}
.active-skill-heading strong{font-size:11px}
.active-skill-heading span{font-size:10px}
.active-skill-buttons{flex-wrap:nowrap;overflow-x:auto;gap:7px;padding:1px 1px 4px}
.active-skill{flex:0 0 190px;min-width:160px;padding:7px 10px;gap:2px;border-radius:7px}
.active-skill-name{font-size:16px}
.active-skill small{font-size:9px;line-height:1.35}
.player-zones{grid-template-columns:minmax(0,2.5fr) minmax(140px,1fr);gap:8px;margin:7px 0 0}
.own-equipment-area,.own-judgment-area{padding:8px 10px}
.player-zones h3{margin-bottom:5px}
.hand-zone{padding:6px 3px 0}
.hand{min-height:112px;padding:7px 3px 4px;gap:6px}
.card{width:74px;height:101px}
.card-name{font-size:23px}
.card-name.long-name{font-size:18px}
.card-description{min-height:27px;padding:3px 2px;font-size:10px;line-height:1.4}
.arena-reference{margin:18px 0 8px;border-top:1px solid #9a87513b;padding-top:9px;color:var(--muted)}
.arena-reference>summary{cursor:pointer;color:#97711c;font-size:12px;letter-spacing:1px;padding:6px 2px}
.arena-reference-content{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.5fr);gap:12px;align-items:start;padding:8px 0 14px}
.arena-reference .objective{padding:14px 16px}
.arena-reference .sidebar-tip{grid-column:1/-1}
.log-dialog-panel{height:min(65vh,560px);max-height:none;min-height:220px;width:100%;background:#15201b}
.log-dialog-panel .log-heading{padding:8px 12px;color:var(--muted);font-size:11px}
.log-dialog-panel .battle-log{font-size:12px;line-height:1.9;padding:8px 14px}
@media(max-width:930px){.game-layout{display:block}.battle-sidebar{display:none}}
@media(max-width:650px){
  .app-header:has(~ #arena:not([hidden])){height:54px;padding-left:12px;padding-right:12px}
  .app-header:has(~ #arena:not([hidden])) nav #generals-btn,.app-header:has(~ #arena:not([hidden])) nav #help-btn,.app-header:has(~ #arena:not([hidden])) nav .sound-controls{display:none}
  .arena{padding:6px 8px 10px}
  .game-toolbar{flex-wrap:nowrap;gap:4px;min-height:38px;margin-bottom:6px}
  .game-toolbar>div:first-child{gap:6px;min-width:0}
  .game-toolbar h1{font-size:14px;letter-spacing:0;white-space:nowrap}
  .game-toolbar .eyebrow{font-size:8px;letter-spacing:1px}
  .toolbar-controls{width:auto;gap:5px;flex:0 0 auto;font-size:9px}
  .toolbar-controls .speed-control{display:none}
  .toolbar-controls .secondary-button{font-size:9px;padding:5px 7px;letter-spacing:0}
  .toolbar-controls #log-open-btn{white-space:nowrap}
  .turn-pill{max-width:100px;padding:2px 6px}
  .board{height:clamp(235px,34svh,330px);min-height:235px}
  .seat{width:96px;min-height:86px;padding:6px 5px}
  .seat-name{font-size:10px}
  .self-seat .seat{width:174px;min-height:66px;padding:6px 8px}
  .self-seat{bottom:8px}
  .table-center{width:42%;min-width:125px}
  .last-card{min-height:46px;margin:6px auto}
  .last-card .mini-played{width:34px;height:47px;font-size:13px}
  #table-event{font-size:8px;min-height:23px}
  .command-bar{display:flex;min-height:58px;padding:6px 8px}
  .command-copy{min-width:0;flex:1}
  .command-copy .eyebrow{font-size:8px}
  .command-copy h2{font-size:11px}
  .command-copy p{font-size:9px;max-width:170px}
  .command-actions{max-width:54%;margin:0;gap:4px}
  .command-actions button{font-size:9px;padding:5px 7px}
  .active-skill-bar{padding:5px 7px;margin-top:5px}
  .active-skill-heading{margin-bottom:3px}
  .active-skill-heading strong{font-size:9px}
  .active-skill-heading span{font-size:8px}
  .active-skill{flex-basis:150px;min-width:145px;padding:5px 7px}
  .active-skill-name{font-size:13px}
  .active-skill-status{font-size:9px}
  .active-skill small{font-size:8px}
  .player-zones{grid-template-columns:minmax(0,1.5fr) minmax(105px,1fr);gap:5px;margin-top:5px}
  .own-equipment-area,.own-judgment-area{padding:6px}
  .own-equipment-slot{min-height:43px;padding:4px 2px}
  .zone-slot-copy strong{font-size:9px}
  .zone-slot-copy small{font-size:7px}
  .player-zones h3{font-size:9px;margin-bottom:3px}
  .own-judge-list,.own-judge-empty{min-height:34px}
  .own-judge-card{min-width:56px;padding:3px;font-size:9px}
  .hand-zone{padding-top:4px}
  .hand-heading{font-size:9px}
  .hand-heading>div{gap:7px}
  .hand-heading .text-button{font-size:9px}
  .hand{min-height:91px;padding:5px 2px 3px;gap:5px}
  .card{width:61px;height:84px}
  .card:before{inset:3px}
  .card-name{font-size:19px}
  .card-name.long-name{font-size:15px}
  .card-suit{font-size:11px;left:6px;top:5px}
  .card-suit span{font-size:10px}
  .card-type{font-size:6px;bottom:5px;letter-spacing:1px}
  .card-description{min-height:20px;padding:2px 1px;font-size:8px;line-height:1.25}
  .arena-reference-content{grid-template-columns:1fr}
}
@media(max-height:740px) and (min-width:651px){.board{height:31svh;min-height:220px}.app-header:has(~ #arena:not([hidden])){height:54px}.arena{padding-top:5px}.hand{min-height:98px}.card{height:88px;width:64px}.active-skill{padding:5px 8px}.player-zones{margin-top:4px}}
