/* V11 · Herramientas opcionales. El visor mantiene sus seis accesos principales. */
.orientation-map {
  position: absolute;
  right: 10px;
  bottom: 59px;
  z-index: 7;
  width: 196px;
  max-width: calc(100% - 20px);
  color: #dbe6fb;
}
.orientation-map details {
  background: #101d30df;
  border: 1px solid #8094b74d;
  border-radius: 12px;
  backdrop-filter: blur(8px);
  overflow: hidden;
}
.orientation-map summary {
  padding: 10px 12px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}
.orientation-map canvas {
  width: 100%;
  height: auto;
  display: block;
  cursor: pointer;
}
.orientation-map p {
  margin: 0 10px 7px;
  font-size: 10px;
  line-height: 1.4;
}
.orientation-map .map-key {
  color: #a0b4d1;
  font-size: 9px;
}
.orientation-map .button {
  width: calc(100% - 16px);
  margin: 0 8px 8px;
  padding: 7px 5px;
  min-height: 32px;
  font-size: 10px;
}
.visual-help {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px 12px;
  margin-top: 8px;
  padding: 9px 12px;
  border: 1px solid #a18abc55;
  border-radius: 10px;
  background: linear-gradient(110deg, #29273d, #182b3c);
  font-size: 12px;
  color: #dce2f6;
}
.visual-help[hidden],
.orientation-map[hidden] {
  display: none;
}
.visual-help .button {
  min-height: 32px;
  padding: 6px 10px;
  font-size: 11px;
}
.discovery-grid > #comparison-panel,
.discovery-grid > #jupiter-panel {
  min-width: 0;
}
.discovery-grid :is(#comparison-panel, #jupiter-panel) > details {
  margin: 0;
}
/* Un catálogo abierto necesita una fila; las herramientas del resto siguen en parejas. */
@media (min-width: 761px) {
  .discovery-grid:has(#bodies-panel[open]) > .sky-controls {
    grid-column: 1 / -1;
  }
}
@container (max-width:540px) {
  .orientation-map {
    width: 158px;
    bottom: 58px;
    right: 8px;
  }
  .orientation-map summary {
    padding: 9px 8px;
    font-size: 11px;
  }
  .scene-shell:has(#navigation-pad details[open]) .orientation-map {
    max-width: calc(100% - 170px);
  }
  .orientation-map .map-key {
    display: none;
  }
  .orientation-map p {
    margin: 0 7px 6px;
  }
}
@media (prefers-reduced-transparency: reduce) {
  .orientation-map details {
    background: #101d30;
    backdrop-filter: none;
  }
}
