/* Board and hand share the field horizontally when the viewport is wide. */
body[data-progression="xp"][data-phase="battle"] #game,body[data-progression="xp"][data-phase="battle"][data-casting="true"] #game{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) 326px;grid-template-rows:minmax(120px,1fr) 40px 36px;gap:5px 12px}
body[data-progression="xp"] #game>.formation{grid-column:1;grid-row:1}
body[data-progression="xp"] #game>.encounter{grid-column:2;grid-row:1}
body[data-progression="xp"] #game>#handSection{grid-column:3;grid-row:1/3;display:flex;flex-direction:column;min-height:0;min-width:0;padding:0}
body[data-progression="xp"] #game>#handSection>.hand-heading{height:26px;min-height:26px;flex:none;justify-content:center;gap:6px;flex-wrap:nowrap}
body[data-progression="xp"] #game>#handSection>.hand-heading>h2,body[data-progression="xp"] #game>#handSection #deckLabel{display:none}
body[data-progression="xp"] #game>#handSection #hand{flex:1;min-height:0}
body[data-progression="xp"] #game #fieldActions{grid-column:1/3;grid-row:2}
body[data-progression="xp"] #game>.controls{grid-column:1/-1;grid-row:3}
body[data-progression="xp"][data-casting="true"] #game>#handSection>.hand-heading{display:flex}
body[data-progression="xp"][data-casting="true"] #game>#handSection>#mainActionDock{position:absolute;left:0;right:338px;bottom:86px;z-index:22;padding:4px 6px;margin:0;background:#10271bf5;max-height:90px}
@media(max-width:700px) and (min-height:501px){
 body[data-progression="xp"][data-phase="battle"] #game,body[data-progression="xp"][data-phase="battle"][data-casting="true"] #game{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(145px,1fr) 40px 185px 36px;gap:4px 10px}
 body[data-progression="xp"] #game>#handSection{grid-column:1/-1;grid-row:3}
 body[data-progression="xp"] #game>#handSection>.hand-heading{height:25px;min-height:25px}
 body[data-progression="xp"] #game>.controls{grid-row:4}
 body[data-progression="xp"][data-casting="true"] #game>#handSection>#mainActionDock{left:0;right:0;bottom:263px;max-height:80px}
}
@media(max-height:500px){
 body[data-progression="xp"][data-phase="battle"] #game,body[data-progression="xp"][data-phase="battle"][data-casting="true"] #game{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) 166px;grid-template-rows:minmax(95px,1fr) 34px 33px;gap:4px 7px}
 body[data-progression="xp"] #game>#handSection #hand{padding:3px 4px 7px;gap:0}
 body[data-progression="xp"] #game>#handSection>.hand-heading{height:25px;min-height:25px}
 body[data-progression="xp"] #inspectHandButton{display:none}
 body[data-progression="xp"][data-casting="true"] #game>#handSection>#mainActionDock{right:173px;bottom:75px;max-height:90px}
}
body[data-progression="xp"][data-phase="camp"] #game,body[data-progression="xp"][data-phase="tavern"] #game,body[data-progression="xp"][data-phase="ended"] #game{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 30px}
/* A selected card uses the former field-strip row for its exact forecast. */
body[data-progression="xp"][data-phase="battle"][data-casting="true"] #game{grid-template-rows:minmax(120px,1fr) 84px 36px}
body[data-progression="xp"][data-casting="true"] #game>#handSection>#mainActionDock{bottom:41px;max-height:84px}
body[data-progression="xp"] .cast-preview>p{display:none}
@media(max-width:700px) and (min-height:501px){body[data-progression="xp"][data-phase="battle"][data-casting="true"] #game{grid-template-rows:minmax(145px,1fr) 80px 185px 36px}body[data-progression="xp"][data-casting="true"] #game>#handSection>#mainActionDock{bottom:225px;max-height:80px}}
@media(max-height:500px){body[data-progression="xp"][data-phase="battle"][data-casting="true"] #game{grid-template-rows:minmax(95px,1fr) 70px 33px}body[data-progression="xp"][data-casting="true"] #game>#handSection>#mainActionDock{bottom:37px;max-height:70px}}