/* Actual body/container width is observed; desktop split panes get the same UI. */
#compact-player-bar,#player-details[hidden]{display:none!important}
body.compact-game #hud{display:block;padding:2px max(6px,env(safe-area-inset-right)) 2px max(6px,env(safe-area-inset-left));padding-top:max(2px,env(safe-area-inset-top))}
body.compact-game #compact-player-bar{display:flex!important;align-items:center;gap:5px;min-width:0}
#compact-player-bar button{min-height:44px;touch-action:manipulation;padding:5px 8px}
#player-details-toggle{flex:1;min-width:0;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem}
#player-details-toggle{display:flex;align-items:center;gap:6px}
.compact-name{min-width:0;overflow:hidden;text-overflow:ellipsis;flex:1}
.compact-castle{flex:none;font-size:.75rem}
#pending-commander-badge{flex:none;min-width:44px;color:#ffe7a3}
#connection-indicator{flex:none;min-width:44px;color:#9bd7ac;font-size:.75rem}
#connection-indicator[data-warning=true]{color:#ffcf8f;border-color:#ffcf8f}
body.compact-game #player-details{position:absolute;top:100%;left:4px;right:4px;max-height:min(70dvh,540px);overflow:auto;overscroll-behavior:contain;padding:10px;background:#172a30fa;border:1px solid #ae945f;border-radius:8px;box-shadow:0 6px 24px #0009;z-index:20}
#player-details-close{float:right;min-height:44px}
#player-details-world{clear:both;font-size:.8rem;overflow-wrap:anywhere}
#player-details-queues{display:flex;flex-wrap:wrap;gap:4px;margin-block:6px}
#player-details-queues button{font-size:.75rem;flex:1 1 80px;min-height:44px}
body.compact-game #player-details .identity{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:4px}
body.compact-game #player-details #army-nav{min-height:44px;white-space:normal}
body.compact-game #player-details #rss{grid-template-columns:repeat(2,minmax(0,1fr));margin-block:8px}
body.compact-game #player-details #status{display:block;max-height:none;font-size:.8rem;margin-block:8px}
body.compact-game #player-details>.controls{display:flex;flex-wrap:wrap;gap:6px;padding:0}
body.compact-game #player-details>.controls>label{width:100%;font-size:.85rem}
body.compact-game #player-details #profiles{width:100%;max-width:none;min-height:44px;font-size:16px}
body.compact-game #player-details #account-tools{position:static;max-width:none;margin:0}
body.compact-game #player-details #account-tools summary,body.compact-game #refresh{min-height:44px}
body.compact-game #connected{grid-template-rows:minmax(0,1fr)}
body.compact-game #overview.composing #world-view{margin-right:0}
body.compact-game #panel.farming{inset:auto max(4px,env(safe-area-inset-right)) 4px max(4px,env(safe-area-inset-left));width:auto;height:260px;max-height:calc(100% - 8px);padding:6px}
body.compact-game #panel.farming #march-title{display:none}
body.compact-game #panel.farming #march-panel{grid-template-rows:auto auto auto minmax(0,1fr) auto auto}
body.compact-game #rail{gap:3px;padding-inline:max(4px,env(safe-area-inset-left)) max(4px,env(safe-area-inset-right))}
body.compact-game #rail>button{min-height:44px;font-size:.7rem;padding:3px 2px;gap:2px}
body.compact-game #rail>button .ui-icon{width:18px;height:20px;padding:0}
body.compact-game #rail>button[data-lane]{font-size:.6rem}
@media(max-height:500px){
 body.compact-game #panel.farming{inset:3px max(4px,env(safe-area-inset-right)) 3px auto;width:calc(100% - 8px);height:auto;padding:5px}
 body.compact-game #panel.farming #march-panel{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto}
}