/* Solo durante fases/eclipses: los rótulos vuelven al cerrar la lección. */
.lesson-focus .observer-label,
.lesson-focus .jupiter-moon-label,
.lesson-focus .planet-places-layer,
.lesson-focus .planet-place-info,
.lesson-focus .lunar-site-label,
.lesson-focus .lunar-site-connector {
  display: none !important;
}

.lesson-light-aid {
  margin: 6px 0 0;
  border: 1px solid #536685;
  border-radius: 10px;
  background: #142238;
  color: #e8efff;
}
.lesson-light-aid[hidden] {
  display: none !important;
}
.lesson-light-aid > summary {
  padding: 9px 12px;
  cursor: pointer;
  color: #f5d898;
  font-size: 13px;
  font-weight: 650;
}
.lesson-light-aid > summary small {
  margin-left: 10px;
  color: #b7c7e0;
  font-size: 11px;
  font-weight: 400;
}
.lesson-light-aid > summary:focus-visible {
  outline: 2px solid #ffdc91;
  outline-offset: 2px;
  border-radius: 8px;
}
.lesson-light-content {
  display: grid;
  grid-template-columns: minmax(280px, 1.2fr) minmax(220px, 1fr);
  align-items: center;
  gap: 12px;
  padding: 0 12px 12px;
}
.lesson-light-drawing {
  min-width: 0;
}
.lesson-light-drawing svg {
  display: block;
  width: 100%;
  max-height: 190px;
}
.lesson-light-drawing text {
  fill: #e7efff;
  font:
    16px system-ui,
    sans-serif;
}
.lesson-light-drawing .shadow-name {
  font-size: 15px;
  fill: #ecf0ff;
}
.lesson-light-drawing .penumbra-name {
  fill: #d4bbff;
}
.lesson-light-caption {
  font-size: 13px;
  line-height: 1.5;
}
.lesson-light-caption strong {
  color: #f3dfa6;
}
.lesson-light-caption p {
  margin: 5px 0;
}
.lesson-light-caption small {
  display: block;
  color: #b9c7e0;
  font-size: 11px;
}
.lesson-umbra-key {
  color: #dce8ff;
  font-weight: 650;
}
.lesson-penumbra-key {
  color: #d4bbff;
  font-weight: 650;
}
@media (max-width: 720px) {
  .lesson-light-content {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }
  .lesson-light-aid > summary small {
    display: none;
  }
}