/* Larger cards fill sparse rows; dense fields wrap at a readable lower bound. */
#table .field{height:auto;min-height:0;max-height:none;overflow:visible;padding:9px 8px}
#table .field .cardRow{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--battle-card-gap,16px);padding:20px 18px 12px;min-height:0;margin:0;overflow:visible}
#table .field .cardRow>.rowLabel{position:absolute;top:4px;left:18px;font-size:9px;letter-spacing:1.2px;min-width:0;color:#bba984}
#table .field .cardRow>.tile,#table .field .cardRow>.tile>.card{width:var(--battle-card-width,150px);height:var(--battle-card-height,209px);min-height:var(--battle-card-height,209px);flex:0 0 var(--battle-card-width,150px)}
#table .field .cardRow>.tile>.card img{width:100%;height:100%;min-height:0;object-fit:cover;object-position:center}
#table .field .tile .stats{font-size:clamp(11px,calc(var(--battle-card-width,150px) * .085),16px);padding:2px 6px}
#table .field .tile .badge{font-size:10px}
#table .field .tile .zoom{width:25px;height:25px;font-size:16px}
#table .field .landRow .landName{font-size:clamp(9px,calc(var(--battle-card-width,132px) * .075),13px);line-height:1.2;max-height:34px;padding:4px}
#table .emptyField{min-height:80px}
#table #hand{gap:var(--hand-card-gap,12px);min-height:calc(var(--hand-card-height,151px) + 32px)}
#table #hand>.tile,#table #hand>.tile>.card{width:var(--hand-card-width,108px);height:var(--hand-card-height,151px);min-height:var(--hand-card-height,151px);flex:0 0 var(--hand-card-width,108px)}
#table #hand>.tile>.card img{height:100%;width:100%;object-fit:cover}
#table .battlefieldViewport{height:max(180px,calc(100dvh - var(--board-top) - var(--dock-height) - var(--lower-table-height)));scrollbar-gutter:stable;overflow-x:hidden}
.dockShortcut{color:#b7aa92}.dockShortcut kbd{font:inherit;border:1px solid #6d5c3f;border-radius:3px;padding:1px 5px;background:#2c261b}
@media(max-width:560px){#table .battleRow{grid-template-columns:minmax(0,1fr)}#table .zoneRack{border-left:0;border-top:1px solid #8f775533;padding:7px 0;max-width:220px;justify-self:end;width:100%}#table .field{padding:6px 2px}#table .field .cardRow{padding:22px 10px 23px}#table .field .cardRow>.rowLabel{left:10px}#table .battlefieldViewport{height:max(50px,calc(100dvh - var(--board-top) - var(--dock-height) - var(--lower-table-height)));max-height:max(50px,calc(100dvh - var(--board-top) - var(--dock-height) - var(--lower-table-height)))}.dockShortcut{display:none}}
/* Both seats stay on screen; only a crowded seat scrolls inside its own half. */
#table .battlefieldViewport{display:grid;grid-template-rows:minmax(0,1fr) 24px minmax(0,1fr);overflow:hidden;scrollbar-gutter:auto;min-height:270px;max-height:none;border:1px solid #75604466;border-radius:9px}
#table .battleRow{min-height:0;grid-template-columns:minmax(0,1fr) 130px;overflow:hidden;position:relative}
#table .enemyRow{background:linear-gradient(180deg,#522e191f,transparent);border-bottom:1px solid #9b744e55}
#table .ownRow{background:linear-gradient(0deg,#174b322b,transparent);border-top:1px solid #56856a66}
#table .field{height:100%;min-height:0;padding:3px 5px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a08758 #171b15;align-content:center;scrollbar-gutter:stable}
#table .field:focus-visible{outline:2px solid #dfc18c;outline-offset:-2px}
#table .field .cardRow{flex-shrink:0;gap:var(--battle-card-gap,14px);padding:17px 12px 7px}
#table .field .cardRow>.rowLabel{top:2px;left:12px;font-size:8px}
#table .field .landRow .landName{font-size:10px;padding:2px;max-height:29px}
#table .field .landRow .tile.tapped{transform:rotate(12deg) scale(.94)}
#table .field[data-scrollable=true]{align-content:start;border-right:2px solid #9d865955}
#table .zoneRack{min-height:0;max-height:100%;align-self:center;grid-template-columns:repeat(3,minmax(0,1fr));padding:6px 5px;gap:6px;border-top:0;max-width:none;width:auto;justify-self:stretch}
#table .zonePile{height:63px}#table .zoneLabel{font-size:7px}#table .zoneSlot>small{display:none}
#table .combat{height:24px;min-height:0;padding:3px 7px;white-space:nowrap;overflow:auto;font-size:10px;background:#17191088;scrollbar-width:thin}
#table .emptyField{min-height:0;height:100%;font-size:9px;letter-spacing:1px}
#table .board>.playerBar{min-height:46px;padding:5px 8px;margin:0;gap:9px}
#table .playerBar .name{gap:1px}#table .playerBar .name>small{font-size:9px;line-height:1.35}#table .playerBar .seatLabel{font-size:8px}
#table .board>.sectionTitle{margin-top:3px;padding:0 6px}
#table #hand{padding:16px 8px 7px;min-height:calc(var(--hand-card-height,151px) + 24px)}
.inGame main{padding-top:8px}.inGame header{height:46px}
#table .tableHeader{margin-bottom:8px}#table .tableHeader .turn{padding:8px 12px}
#table .gameGrid{grid-template-columns:200px minmax(0,1fr) 185px;gap:10px}
#table .turnRail{padding:9px}
@media(min-width:851px) and (max-height:850px){#table .tableHeader .turn{padding:6px 10px}#table .tableHeader .turn h2{font-size:17px}#table .tableHeader .decisionBlock #prompt{font-size:11px}#table .tableHeader .decisionBlock p{font-size:10px;margin:2px 0}#table .board>.playerBar{min-height:42px}#commandDock{min-height:72px;padding:8px 12px}#commandDock #commandHint{font-size:10px}}
@media(max-width:1200px){#table .gameGrid{grid-template-columns:175px minmax(0,1fr) 170px;gap:8px}}
@media(max-width:850px){#table .gameGrid{grid-template-columns:minmax(0,1fr) 170px}.inGame header{height:auto}#table .turnRail{grid-column:1/-1}#table .battleRow{grid-template-columns:minmax(0,1fr) 110px}#table .zonePile{height:53px}}
@media(max-width:560px){#table .gameGrid{grid-template-columns:minmax(0,1fr)}#table .battlefieldViewport{height:max(300px,calc(100dvh - var(--board-top) - var(--dock-height) - var(--lower-table-height)));min-height:300px;max-height:none}#table .battleRow{grid-template-columns:minmax(0,1fr) 54px}#table .zoneRack{grid-template-columns:1fr;padding:4px 5px;gap:6px}#table .zoneSlot{display:grid;grid-template-columns:1fr;align-items:center}#table .zoneLabel{font-size:6px;margin-bottom:2px}#table .zonePile{height:28px}#table .pileEmpty{font-size:15px}#table .zonePile .pileCount{height:15px;min-width:17px;font-size:8px;bottom:0;right:-2px}#table .zoneRack .backEmblem{font-size:14px}#table .zoneRack .backOrbs{display:none}#table .field .cardRow{padding:16px 8px 6px}#table .playerBar .name>small{font-size:8px}#table .playerBar .life{min-width:48px;font-size:20px}#table .tableHeader .turnReadout{gap:5px}#table .tableHeader .decisionBlock{padding-top:5px}}
/* Lands stay visible at the rear as compact strips; front rows scroll on their own. */
#table .field{gap:2px;overflow:hidden;scrollbar-gutter:auto;display:flex;justify-content:flex-start}
#table .field .cardRow:not(.landRow){flex:1 1 auto;min-height:0;align-items:flex-start;align-content:safe center;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a08758 #171b15;scrollbar-gutter:stable}
#table .field .landRow{flex:0 0 auto;flex-wrap:nowrap;justify-content:safe center;overflow-x:auto;overflow-y:hidden;padding:12px 10px 4px;margin:0;scrollbar-width:thin}
#table .field .cardRow{padding:12px 10px 5px}
#table .field .cardRow>.rowLabel{top:1px;left:10px;font-size:7px}
#table .field .landRow .card img{object-position:center 35%}
#table .field .landRow .landName{font-size:10px;line-height:1.1;max-height:24px;background:#111b16ed}
#table .field .landRow .zoom{height:20px;width:20px;font-size:13px;top:1px;right:1px}
#table .field .landRow .tile.tapped{transform:rotate(7deg) scale(.92)}
#table .playerBar .name{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1px 6px;align-items:center}#table .playerBar .name>small{grid-column:1/-1}
#table .board>.playerBar{min-height:40px}#table .playerBar .name>strong{font-size:11px}
#table .field{padding:2px;gap:2px}#table .field .cardRow{padding:10px 10px 3px}#table .field .landRow{padding:10px 10px 3px}
#table .handSizeButton{font-size:9px;padding:3px 8px;margin-left:auto}#table .board>.sectionTitle{gap:8px}
#table #hand.compactHand{padding:12px 8px 5px;min-height:calc(var(--hand-card-height,78px) + 18px)}#table #hand.compactHand .landName{font-size:8px;padding:2px}#table #hand.compactHand .zoom{width:19px;height:19px;font-size:12px}
@media(min-width:851px) and (max-height:850px){.inGame header{height:36px}.inGame header .brandMark{width:24px;height:24px;font-size:18px}.inGame header button{padding:4px 8px}#table .tableHeader .turn{padding:4px 8px}#table .tableHeader .turn h2{font-size:15px}#table .tableHeader .turnMeta{font-size:9px}}
@media(max-width:560px){#table .board>.sectionTitle #handHint{display:none}}
@media(max-width:560px){#table .tableHeader #decisionHint{display:none}#table .tableHeader .turn h2{font-size:14px}#table .tableHeader .turnMeta{font-size:9px}#table .battlefieldViewport{min-height:260px;height:max(260px,calc(100dvh - var(--board-top) - var(--dock-height) - var(--lower-table-height)));grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) 24px}#table .enemyRow{grid-column:1;grid-row:1;border-right:1px solid #b9906055;border-bottom:0}#table .ownRow{grid-column:2;grid-row:1;border-top:0}#table .combat{grid-column:1/-1;grid-row:2}#table .battleRow{grid-template-columns:minmax(0,1fr) 40px;padding-top:16px}#table .battleRow::before{position:absolute;top:2px;left:7px;font-size:8px;font-weight:700;letter-spacing:.7px;color:#d5b895}#table .enemyRow::before{content:'AVVERSARIO'}#table .ownRow::before{content:'IL TUO CAMPO';color:#a7dcb8}#table .zonePile{height:30px}#table .field .cardRow{padding-left:2px;padding-right:2px}#table .field .rowLabel{left:2px}#table .zoneRack{padding:4px 3px}}
#table .field{padding:1px;gap:2px}#table .field .cardRow{padding-top:9px;padding-bottom:2px}#table .field .landRow{padding-top:9px;padding-bottom:2px}
@media(max-width:560px){#table .battlefieldViewport{height:max(242px,calc(100dvh - var(--board-top) - var(--dock-height) - var(--lower-table-height)));min-height:242px}}