.world-camera {
  position: fixed; bottom: max(42px, env(safe-area-inset-bottom)); left: 50%;
  transform: translateX(-50%); z-index: 45; display: flex; align-items: center;
  gap: 5px; padding: 8px; border: 1px solid #ffffff25; border-radius: 14px;
  background: #14232ee8; box-shadow: 0 8px 28px #0005; backdrop-filter: blur(16px);
  color: #dae9ea; font: 13px system-ui, sans-serif; max-width: calc(100vw - 24px);
  flex-wrap: wrap; justify-content: center;
}
.world-camera[hidden] { display: none; }
.world-camera button {
  border: 1px solid #ffffff20; border-radius: 8px; padding: 8px 11px;
  background: #ffffff09; color: inherit; font: inherit; white-space: nowrap;
  cursor: pointer; text-decoration: none; min-height: 36px;
}
.world-camera button:hover, .world-camera button[aria-pressed=true] { background: #b9dbc62a; }
.world-camera button[aria-pressed=true] { border-color: #c5ff4570; color: #d7ff92; }
.world-camera :focus-visible { outline: 2px solid #bdecc9; outline-offset: 2px; }
@media (max-width: 680px) {
  .world-camera { bottom: max(110px, env(safe-area-inset-bottom)); width: max-content; }
  .world-camera button { padding: 6px 8px; }
}
/* Keep camera choices below the status strip, away from the central character
   and the separate handheld control tray. The minimap follows beneath them. */
@media (orientation: portrait) {
  body.mobile .world-camera {
    top: calc(var(--hud-strip-h, 42px) + 18px);
    bottom: auto;
  }
  body.mobile:has(.world-camera:not([hidden]) [data-camera-mode]) #minimap {
    top: calc(var(--hud-strip-h, 42px) + 84px);
  }
}