/* Card Arena 0.1.8. A flat shared playfield: opponent above, player below.
   This component owns board geometry; the existing game-mode portal owns the app shell. */
.mdv-ca-root .mdv-ca-table.mdv-ca-playfield{
 --mdv-ca-playfield-active-height:192px;--mdv-ca-playfield-bank-height:118px;
 display:grid;grid-template-columns:minmax(128px,30%) minmax(0,1fr);
 grid-template-rows:36px minmax(0,1fr) 20px minmax(0,1fr) 36px;
 gap:6px 16px;padding:8px 18px;min-height:548px;height:auto;perspective:none;align-items:stretch;
}
.mdv-ca-root .mdv-ca-playfield>.mdv-ca-player[data-player=bot]{grid-area:1/1/2/3}
.mdv-ca-root .mdv-ca-playfield>.mdv-ca-player[data-player=human]{grid-area:5/1/6/3}
.mdv-ca-root .mdv-ca-playfield>.mdv-ca-bank[data-bank=bot]{grid-area:2/2/3/3}
.mdv-ca-root .mdv-ca-playfield>.mdv-ca-bank[data-bank=human]{grid-area:4/2/5/3}
.mdv-ca-root .mdv-ca-playfield>.mdv-ca-bank{max-width:none;justify-self:stretch;align-content:center;grid-template-columns:repeat(5,minmax(44px,1fr));gap:4px;min-height:0}
.mdv-ca-root .mdv-ca-playfield>.mdv-ca-battle{
 grid-area:2/1/5/2;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 20px minmax(0,1fr);
 gap:4px;perspective:none;position:relative;width:100%;height:100%;min-height:0;align-items:center;
}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-active-zone{position:static!important;width:100%!important;max-width:none!important;margin:0!important;display:flex!important;flex-direction:column!important;gap:3px;min-height:0;align-self:center;align-items:center}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-active-zone[data-side=bot]{grid-area:1/1}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-active-zone[data-side=human]{grid-area:3/1}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-zone-side{position:static!important;width:auto!important;text-align:center!important;min-height:12px}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-zone-side strong{font-size:10px;line-height:12px;letter-spacing:1px}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-zone-side small{display:none}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-centerline{grid-area:2/1;position:static;flex-direction:row;gap:5px;min-height:20px;max-width:100%;font-size:10px;white-space:nowrap;align-self:center}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-centerline span{display:none}
.mdv-ca-root .mdv-ca-playfield :is(.mdv-ca-active-zone .mdv-ca-card,.mdv-ca-active-empty,.mdv-ca-hidden-card:not(.mdv-ca-hidden-bench)){
 width:min(100%,max(108px,calc((var(--mdv-ca-playfield-active-height) - 28px)*245/337 + 10px)))!important;
 height:var(--mdv-ca-playfield-active-height)!important;min-height:44px;transform:none!important;padding:4px;flex-shrink:0;border-radius:8px;
}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-active-zone .mdv-ca-card-image{inset:4px 4px 28px;width:calc(100% - 8px);height:calc(100% - 32px)}
.mdv-ca-root .mdv-ca-playfield :is(.mdv-ca-bank-slot,.mdv-ca-bench-card,.mdv-ca-hidden-bench){height:var(--mdv-ca-playfield-bank-height);min-height:44px;padding:3px;border-radius:6px}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-bench-card .mdv-ca-card-image{inset:3px 3px 31px;width:calc(100% - 6px);height:calc(100% - 34px)}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-bank-label{height:14px;min-height:0;line-height:14px;font-size:9px;letter-spacing:1px;margin:0}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-opponent-hand{display:none}
.mdv-ca-root .mdv-ca-playfield .mdv-ca-bench-card .mdv-ca-unit-stats{margin-top:3px;gap:2px}
.mdv-ca-root[data-height=auto]:not(.mdv-ca-focus) .mdv-ca-table.mdv-ca-playfield{min-height:596px;--mdv-ca-playfield-active-height:216px;--mdv-ca-playfield-bank-height:138px}
.mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield{
 /* Residual table height already excludes toolbar, safe areas, hand and actions. */
 container:mdv-ca-playfield / size;
 --mdv-ca-playfield-active-height:clamp(44px,calc((100cqh - 126px)/2),300px);
 --mdv-ca-playfield-bank-height:clamp(44px,calc((100cqh - 126px)/2 - 20px),150px);
 grid-template-columns:minmax(108px,30%) minmax(0,1fr);grid-template-rows:24px minmax(0,1fr) 20px minmax(0,1fr) 24px;
 min-height:0;height:100%;padding:4px 12px;gap:4px 12px;
}
.mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield>.mdv-ca-battle{grid-area:2/1/5/2;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 20px minmax(0,1fr);gap:4px}
.mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield>.mdv-ca-player[data-player=bot]{grid-area:1/1/2/3}
.mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield>.mdv-ca-player[data-player=human]{grid-area:5/1/6/3}
.mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield>.mdv-ca-bank[data-bank=bot]{grid-area:2/2/3/3}
.mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield>.mdv-ca-bank[data-bank=human]{grid-area:4/2/5/3}
.mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield>.mdv-ca-bank{grid-template-columns:repeat(5,minmax(44px,1fr));align-content:center}
.mdv-ca-root.mdv-ca-focus .mdv-ca-playfield .mdv-ca-active-zone[data-side=bot]{grid-area:1/1}
.mdv-ca-root.mdv-ca-focus .mdv-ca-playfield .mdv-ca-active-zone[data-side=human]{grid-area:3/1}
.mdv-ca-root.mdv-ca-focus .mdv-ca-playfield .mdv-ca-centerline{grid-area:2/1;min-height:20px}
.mdv-ca-root.mdv-ca-focus .mdv-ca-playfield :is(.mdv-ca-active-zone .mdv-ca-card,.mdv-ca-active-empty,.mdv-ca-hidden-card:not(.mdv-ca-hidden-bench)){
 width:min(100%,max(108px,calc((var(--mdv-ca-playfield-active-height) - 28px)*245/337 + 10px)))!important;
 height:var(--mdv-ca-playfield-active-height)!important;
}
.mdv-ca-root.mdv-ca-focus .mdv-ca-playfield :is(.mdv-ca-bank-slot,.mdv-ca-bench-card,.mdv-ca-hidden-bench){height:var(--mdv-ca-playfield-bank-height)}
@container mdv-ca-arena (max-width:600px){
 .mdv-ca-root .mdv-ca-table.mdv-ca-playfield{grid-template-columns:minmax(108px,34%) minmax(0,1fr);padding-inline:10px;gap:4px 8px;--mdv-ca-playfield-active-height:174px;--mdv-ca-playfield-bank-height:76px;min-height:508px}
 .mdv-ca-root .mdv-ca-table.mdv-ca-playfield>.mdv-ca-bank{grid-template-columns:repeat(3,minmax(44px,1fr));gap:3px}
 .mdv-ca-root[data-height=auto]:not(.mdv-ca-focus) .mdv-ca-table.mdv-ca-playfield{min-height:548px;--mdv-ca-playfield-active-height:190px;--mdv-ca-playfield-bank-height:92px}
 .mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield{
 --mdv-ca-playfield-active-height:clamp(44px,calc((100cqh - 126px)/2),300px);
 --mdv-ca-playfield-bank-height:clamp(44px,calc((100cqh - 148px)/4),100px);
 min-height:0;gap:4px 8px;
 }
 .mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield>.mdv-ca-bank{grid-template-columns:repeat(3,minmax(44px,1fr));gap:3px}
 .mdv-ca-root .mdv-ca-playfield .mdv-ca-centerline{gap:3px}
 .mdv-ca-root .mdv-ca-playfield .mdv-ca-centerline strong{font-size:10px}
 .mdv-ca-root .mdv-ca-playfield .mdv-ca-centerline small{font-size:8px}
}
.mdv-ca-root.mdv-ca-focus[data-game-layout=landscape] .mdv-ca-table.mdv-ca-playfield{
 grid-template-columns:minmax(108px,28%) minmax(0,1fr);grid-template-rows:22px minmax(0,1fr) 14px minmax(0,1fr) 22px;
 padding:3px 8px;gap:3px 8px;
 --mdv-ca-playfield-active-height:clamp(44px,calc((100cqh - 108px)/2),132px);
 --mdv-ca-playfield-bank-height:clamp(44px,calc((100cqh - 108px)/2),100px);
}
.mdv-ca-root.mdv-ca-focus[data-game-layout=landscape] .mdv-ca-table.mdv-ca-playfield>.mdv-ca-battle{grid-template-rows:minmax(0,1fr) 14px minmax(0,1fr);gap:3px}
.mdv-ca-root.mdv-ca-focus[data-game-layout=landscape] .mdv-ca-playfield .mdv-ca-centerline{min-height:14px;font-size:9px;gap:3px}
.mdv-ca-root.mdv-ca-focus[data-game-layout=landscape] .mdv-ca-playfield .mdv-ca-centerline strong{font-size:10px}
.mdv-ca-root.mdv-ca-focus[data-game-layout=landscape] .mdv-ca-playfield .mdv-ca-centerline small{font-size:8px}
/* A short landscape with safe-area insets has less board space than its viewport.
   Player HUDs already identify both halves; hide duplicate decorative zone headings
   only when the actual residual table becomes short, and budget cards to that space. */
@container mdv-ca-playfield (max-height:236px){
 .mdv-ca-root.mdv-ca-focus[data-game-layout=landscape] .mdv-ca-playfield>.mdv-ca-battle{--mdv-ca-playfield-active-height:clamp(44px,calc((100cqh - 88px)/2),70px)}
 .mdv-ca-root.mdv-ca-focus[data-game-layout=landscape] .mdv-ca-playfield>.mdv-ca-bank{--mdv-ca-playfield-bank-height:clamp(44px,calc((100cqh - 82px)/2),70px);gap:3px}
 .mdv-ca-root.mdv-ca-focus[data-game-layout=landscape] .mdv-ca-playfield :is(.mdv-ca-zone-side,.mdv-ca-bank-label){display:none}
}
/* Older engines without block container units retain a bounded static board. */
@supports not (height:1cqh){
 .mdv-ca-root.mdv-ca-focus .mdv-ca-table.mdv-ca-playfield{--mdv-ca-playfield-active-height:140px;--mdv-ca-playfield-bank-height:80px}
 .mdv-ca-root.mdv-ca-focus[data-game-layout=landscape] .mdv-ca-table.mdv-ca-playfield{--mdv-ca-playfield-active-height:52px;--mdv-ca-playfield-bank-height:44px}
}