/* Desktop reading distance follows CSS viewport size (including OS/browser scaling).
   Keep one central table; never spread public cards and Challenge across the monitor. */
@media(min-width:1000px) and (min-height:760px){
 body.combat-screen:not([data-layout=portrait]){--battle-zoom:1}
 body.combat-screen:not([data-layout=portrait]) #app{height:100dvh;grid-template-rows:52px minmax(0,1fr)}
 body.combat-screen:not([data-layout=portrait]) .game-shell{zoom:var(--battle-zoom);width:min(1600px,calc(100% / var(--battle-zoom)));height:min(1000px,calc((100dvh - 52px) / var(--battle-zoom)));min-width:0;min-height:0;justify-self:center;align-self:center;grid-template-columns:145px minmax(0,1fr);margin:0 auto}
 body.combat-screen:not([data-layout=portrait]) .game-content{overflow:auto;min-height:0;scrollbar-gutter:stable}
 body.combat-screen:not([data-layout=portrait]) #app .battle-layout{min-height:100%;height:auto;max-width:none;box-sizing:border-box;overflow:visible;padding:12px 18px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:64px auto minmax(350px,1fr) auto auto;gap:8px 12px}
 body.combat-screen:not([data-layout=portrait]) #app .table-center{grid-template-columns:minmax(0,1fr);grid-template-rows:17px 62px auto minmax(108px,1fr) auto;gap:3px;overflow:visible;padding:8px 14px;min-height:0}
 body.combat-screen:not([data-layout=portrait]) #app .opponent-hand-label{grid-area:1/1/2/2;text-align:center}
 body.combat-screen:not([data-layout=portrait]) #app .battle-layout .opponent-hand{grid-area:2/1/3/2;justify-content:safe center}
 body.combat-screen:not([data-layout=portrait]) #app .community-zone{grid-area:3/1/4/2;align-self:stretch;padding:4px 10px 8px;border-bottom:1px solid #c8e99133}
 body.combat-screen:not([data-layout=portrait]) #app .community-cards{justify-content:safe center;flex-wrap:nowrap;overflow-x:auto;padding:4px 5px 8px;max-width:100%}
 body.combat-screen:not([data-layout=portrait]) #app .community-cards .poker-card{width:68px!important;height:96px!important;flex:0 0 68px}
 body.combat-screen:not([data-layout=portrait]) #app .challenge-zone{grid-area:4/1/5/2;border-left:0;padding:8px 14px;min-width:0}
 body.combat-screen:not([data-layout=portrait]) #app .challenge-footer{grid-area:5/1/6/2;min-width:0;flex-wrap:wrap;justify-content:center;padding:5px 2px}
 body.combat-screen:not([data-layout=portrait]) #app .chain-history{max-width:100%;overflow:hidden}
 body.combat-screen:not([data-layout=portrait]) #app .hands-area{height:auto;max-height:none;min-height:0;align-items:start;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
 body.combat-screen:not([data-layout=portrait]) #app .hand-label{min-height:26px;height:auto;flex-wrap:wrap;gap:5px}
 body.combat-screen:not([data-layout=portrait]) #app .poker-hand{height:calc(96px * var(--card-scale,1) + 30px);min-height:0;overflow-y:hidden}
 body.combat-screen:not([data-layout=portrait]) #app .left-tools,body.combat-screen:not([data-layout=portrait]) #app .right-tools{height:auto;min-height:25px;flex-wrap:wrap;gap:6px 12px}
 body.combat-screen:not([data-layout=portrait]) #app .right-hand{padding-top:0;border-top:0}
 body.combat-screen:not([data-layout=portrait]) #app .combat-controls{position:relative;bottom:auto;min-height:84px;height:auto;overflow:visible;grid-template-columns:minmax(145px,.8fr) minmax(180px,1fr) auto;margin:0;padding:10px 12px;align-items:center}
 body.combat-screen:not([data-layout=portrait]) #app .action-buttons{grid-column:auto;flex-direction:row}
 body.combat-screen:not([data-layout=portrait]) #app .selection-preview{min-width:0}
}
@media(min-width:2200px) and (min-height:1200px){body.combat-screen:not([data-layout=portrait]){--battle-zoom:1.25}}
@media(min-width:3200px) and (min-height:1700px){body.combat-screen:not([data-layout=portrait]){--battle-zoom:1.6}}
/* Short windows and explicit portrait mode must scroll rather than clip controls. */
@media(min-width:1000px) and (max-height:759px){body.combat-screen .game-content{overflow:auto}body.combat-screen #app .battle-layout{overflow:visible;height:auto}}
@media(min-width:1000px) and (min-height:600px){body.combat-screen[data-layout=portrait] .game-content{overflow:auto}body.combat-screen[data-layout=portrait] #app .battle-layout{height:auto;overflow:visible}}
