/* GAME_CLIENT: горизонтальный отряд с контурными головами и реальным HP. */
.voxel-dwarf-roster-hud {
  position: absolute;
  top: 16px;
  left: 16px;
  top: max(16px, env(safe-area-inset-top));
  left: max(16px, env(safe-area-inset-left));
  z-index: 19;
  display: flex;
  gap: 8px;
  max-width: calc(100% - 280px - env(safe-area-inset-left) - env(safe-area-inset-right));
  padding: 4px;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #596139 transparent;
  pointer-events: auto;
  touch-action: pan-x;
}
.voxel-dwarf-roster-hud[hidden] { display: none; }
.voxel-dwarf-roster-button { position: relative; flex: 0 0 72px; width: 72px; height: 84px; padding: 0 7px 28px; border: 0; border-radius: 0; color: #eee5d0; background: transparent; cursor: pointer; }
.voxel-rts-portrait { display: block; width: 48px; height: 48px; margin: auto; opacity: .5; background-repeat: no-repeat; transform-origin: center bottom; transition: opacity 120ms, transform 120ms; filter: drop-shadow(0 1px 2px #17150e); pointer-events: none; }
.voxel-rts-roster-name { position: absolute; left: 0; right: 0; bottom: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 11px/18px system-ui,sans-serif; text-shadow: 0 1px 3px #000; pointer-events: none; }
.voxel-dwarf-roster-button:hover .voxel-rts-portrait,
.voxel-dwarf-roster-button:focus-visible .voxel-rts-portrait { opacity: .9; }
.voxel-dwarf-roster-button.selected .voxel-rts-portrait { opacity: 1; transform: scale(1.1667); }
.voxel-dwarf-roster-button.selected::after { content: ''; position: absolute; left: 32px; bottom: 27px; width: 8px; height: 8px; background: #d9ac59; transform: rotate(45deg); }
.voxel-dwarf-roster-button:focus-visible { outline: 2px solid #d9ac59; outline-offset: -2px; }
.voxel-rts-health { position: absolute; left: 9px; right: 9px; bottom: 21px; height: 4px; background: rgba(23, 21, 14, .8); pointer-events: none; }
.voxel-rts-health::after { content: ''; display: block; height: 100%; width: var(--health, 0%); background: #71924a; }
.voxel-rts-health[hidden] { display: none; }
@media (min-width: 1280px) and (min-height: 700px) {
  .voxel-rts-portrait { width: 57.6px; height: 57.6px; }
  .voxel-dwarf-roster-button { height: 100px; }
  .voxel-rts-active .voxel-room-panel { top: 132px !important; }
}
@media (max-width: 620px) {
  .voxel-dwarf-roster-hud { top: calc(max(16px, env(safe-area-inset-top)) + 136px); max-width: calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)); }
}
@media (prefers-reduced-motion: reduce) { .voxel-rts-portrait { transition: none; } }
