/* Space 2047 HD Edition v5.41.0 — compact mobile mission strip and unobstructed map. */

@media (max-width: 760px), (pointer: coarse) {
  /* Fit the mission control on the same top row between Menu and Options. */
  #s2047-mwo-hud {
    top: max(10px, env(safe-area-inset-top)) !important;
    left: max(112px, calc(env(safe-area-inset-left) + 112px)) !important;
    right: max(112px, calc(env(safe-area-inset-right) + 112px)) !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 76px !important;
    transform: none !important;
    grid-template-columns: minmax(0, 1fr) 34px !important;
    border-radius: 12px !important;
    overflow: visible !important;
  }

  #s2047-mwo-hud .s2047-mwo-focus {
    min-width: 0 !important;
    height: 74px !important;
    padding: 7px 8px !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr !important;
    align-content: center !important;
    gap: 2px !important;
  }

  #s2047-mwo-hud .s2047-mwo-focus span {
    grid-row: auto !important;
    font-size: 8px !important;
    line-height: 1 !important;
  }

  #s2047-mwo-hud .s2047-mwo-focus strong {
    display: block !important;
    min-width: 0 !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  #s2047-mwo-hud .s2047-mwo-focus small {
    display: none !important;
  }

  #s2047-mwo-hud .s2047-mwo-expand {
    min-width: 34px !important;
    padding: 0 !important;
    font-size: 18px !important;
  }

  #s2047-mwo-hud .s2047-mwo-list {
    position: absolute !important;
    top: calc(100% + 6px) !important;
    left: 0 !important;
    right: 0 !important;
    max-height: 40vh !important;
    border: 1px solid rgba(90,207,241,.5) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 36px rgba(0,0,0,.65) !important;
  }

  /* Keep the map completely above the lower action controls. */
  #s2047-minimap-wrap,
  .s2047-minimap-wrap {
    top: auto !important;
    right: max(10px, env(safe-area-inset-right)) !important;
    bottom: calc(max(8px, env(safe-area-inset-bottom)) + 270px) !important;
    width: 92px !important;
    padding: 5px !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    z-index: 2147482500 !important;
  }

  #s2047-minimap-wrap canvas,
  .s2047-minimap-wrap canvas {
    width: 80px !important;
    height: 80px !important;
    border-radius: 9px !important;
  }

  #s2047-minimap-wrap span,
  .s2047-minimap-wrap span {
    display: block !important;
    padding-top: 4px !important;
    font-size: 8px !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 390px) {
  #s2047-mwo-hud {
    left: max(98px, calc(env(safe-area-inset-left) + 98px)) !important;
    right: max(98px, calc(env(safe-area-inset-right) + 98px)) !important;
  }

  #s2047-mwo-hud .s2047-mwo-focus strong {
    font-size: 11px !important;
  }

  #s2047-minimap-wrap,
  .s2047-minimap-wrap {
    bottom: calc(max(7px, env(safe-area-inset-bottom)) + 252px) !important;
    width: 82px !important;
  }

  #s2047-minimap-wrap canvas,
  .s2047-minimap-wrap canvas {
    width: 70px !important;
    height: 70px !important;
  }
}

@media (max-height: 690px) and (max-width: 760px) {
  #s2047-minimap-wrap,
  .s2047-minimap-wrap {
    bottom: calc(max(6px, env(safe-area-inset-bottom)) + 232px) !important;
  }
}
