.building-selection {
  position: fixed;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  z-index: 2;
  pointer-events: none;
  --selection-scale: 1;
}
.building-selection-label {
  position: absolute;
  left: 0;
  transform: translate(-50%, -100%);
  text-align: center;
  white-space: nowrap;
  font: 900 calc(15px * var(--selection-scale)) / 1.05 Arial, sans-serif;
  color: #fff7d3;
  -webkit-text-stroke: 3px #283615;
  paint-order: stroke fill;
  text-shadow: 0 2px 0 #18230e;
}
.building-selection-label strong, .building-selection-label span { display: block; }
.building-selection-label span {
  color: #c9f484;
  font-size: calc(13px * var(--selection-scale));
  margin-top: 1px;
}
.building-selection .direction-handle {
  position: absolute;
  width: calc(44px * var(--selection-scale));
  height: calc(40px * var(--selection-scale));
  padding: calc(7px * var(--selection-scale));
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: translate(-50%, -50%);
  pointer-events: auto;
  touch-action: manipulation;
}
.direction-handle img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}
.direction-handle[data-building-direction="-1,0"] img { transform: rotate(180deg); }
.direction-handle[data-building-direction="0,-1"] img { transform: scaleY(-1); }
.direction-handle[data-building-direction="0,1"] img { transform: scaleX(-1); }
.building-selection .direction-handle:hover {
  background: transparent;
  transform: translate(-50%, -50%) scale(1.12);
}
.building-selection .direction-handle:disabled { opacity: .45; }
.building-selection .direction-handle:focus-visible {
  outline: 2px solid #f8ffd2;
  border-radius: 7px;
}
.building-selection.moving .direction-handle:disabled { opacity: 1; }
.building-selection.move-blocked .direction-handle img { filter: hue-rotate(290deg); }
.building-actions {
  position: fixed;
  bottom: 25px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 10px;
  z-index: 5;
}
.building-actions button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 88px;
  height: 80px;
  padding: 7px;
  background: linear-gradient(#f5f3e8, #c7c6bd);
  border: 2px solid #64645c;
  border-radius: 11px;
  box-shadow: inset 0 1px 0 #fff, 0 3px 0 #3f4335;
  color: #fff;
  font: 900 14px Arial, sans-serif;
  text-shadow: -1px -1px #3f422f, 1px -1px #3f422f, -1px 1px #3f422f, 1px 2px #3f422f;
}
.building-actions button:hover { background: linear-gradient(#fffef4, #dfdfd1); }
.building-actions img { height: 38px; width: 42px; object-fit: contain; }
.building-actions [hidden], .building-actions[hidden], .building-selection[hidden] { display: none !important; }
body.building-selected #tray { visibility: hidden; }
#world { cursor: grab; }
#world.dragging-building { cursor: grabbing; }
.screen-reader-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (max-width: 680px) {
  .building-actions { bottom: 116px; }
  .building-actions button { width: 76px; height: 72px; }
}