/* The universe remains visible between destinations and through their main panels. */
body .universo.journey-view {
  --station-surface: linear-gradient(145deg, rgba(8, 30, 57, .72), rgba(18, 16, 47, .66));
  --station-surface-soft: linear-gradient(145deg, rgba(8, 28, 53, .48), rgba(17, 14, 44, .42));
}

body .universo.journey-view .lesson::before {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

body .universo.journey-view :is(.actor-ecosystem, .expectations-section, .experience-journey, .constellation-map > section, .observatory-orbit, .metric-constellation, .signal-challenge, .coordinate-challenge, .discovery-reading) {
  background: linear-gradient(145deg, rgba(5, 24, 48, .53), rgba(17, 13, 43, .46));
  backdrop-filter: none;
  box-shadow: inset 0 1px rgba(225, 243, 255, .04);
}

body .universo.journey-view :is(.coordinate-role-card, .planet-route-card) {
  background: radial-gradient(ellipse at 50% 25%, rgba(119, 205, 229, .09), transparent 58%),
    linear-gradient(145deg, rgba(8, 29, 53, .61), rgba(20, 16, 46, .54));
}

body .universo.journey-view .discovery-solar-system {
  background: radial-gradient(ellipse at 50% 46%, rgba(241, 139, 21, .08), transparent 45%),
    linear-gradient(145deg, rgba(4, 21, 43, .32), rgba(15, 12, 39, .24));
}

body .universo.journey-view .mission-finale .mission-grid > label {
  background: linear-gradient(140deg, rgba(12, 34, 55, .66), rgba(19, 18, 45, .61));
}

body .universo.journey-view .mission-finale .mission-grid > .mission-action-card {
  background: linear-gradient(140deg, rgba(27, 54, 47, .54), rgba(12, 29, 50, .64));
}

/* A visible invitation and three substantial controls distinguish the reading paths. */
.discovery-explore-options { flex: none; min-width: 0; }
.discovery-tabs-intro {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 9px;
  color: #d9efb7;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}
.discovery-tabs-intro::before { content: "✦"; color: #d9ff6a; font-size: 15px; }
.discovery-reading-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 0;
  border: 0;
}
.discovery-reading-tabs button {
  position: relative;
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr) 13px;
  align-items: center;
  gap: 8px;
  min-height: 60px;
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid #a0dbe57d;
  border-radius: 13px;
  background: linear-gradient(145deg, #16354bdc, #18213de6);
  color: #eff8ff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
  text-align: left;
  text-shadow: none;
  box-shadow: inset 0 1px #d9faff22, 0 4px 14px #0002;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.discovery-reading-tabs button b { font: inherit; }
.discovery-reading-tabs button > .discovery-tab-number {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border: 1px solid #c4edf280;
  border-radius: 50%;
  background: #8cd5e315;
  color: #c7f2f5;
  font-size: 11px;
  font-weight: 800;
}
.discovery-reading-tabs button > .discovery-tab-arrow {
  display: block;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background: none;
  color: #d9ff81;
  font-size: 16px;
  line-height: 1;
  text-align: right;
}
.discovery-reading-tabs button[aria-pressed="true"] {
  border-color: #d9ff81;
  background: linear-gradient(130deg, #d9ff81, #a5e27b);
  color: #092131;
  box-shadow: inset 0 1px #f5ffdb, 0 0 22px #c5f76b21;
}
.discovery-reading-tabs button[aria-pressed="true"] > .discovery-tab-number {
  border-color: #143c3a66;
  background: #0f343a;
  color: #e1ffa2;
}
.discovery-reading-tabs button[aria-pressed="true"] > .discovery-tab-arrow {
  background: none;
  color: #113a37;
}
.discovery-reading-tabs button:hover {
  border-color: #e4ffa5;
  box-shadow: inset 0 1px #f0ffcb40, 0 0 0 2px #d9ff8122, 0 6px 16px #0003;
  transform: translateY(-2px);
}
.discovery-reading-tabs button:focus-visible { outline: 3px solid #efffc6; outline-offset: 3px; }

@media (max-height: 720px) and (min-width: 801px) {
  .discovery-tabs-intro { margin-bottom: 6px; }
  .discovery-reading-tabs { gap: 6px; }
  .discovery-reading-tabs button { min-height: 54px; grid-template-columns: 22px minmax(0, 1fr) 11px; gap: 6px; padding: 8px; font-size: 12px; }
  .discovery-reading-tabs button > .discovery-tab-number { width: 22px; height: 22px; }
}

@media (max-width: 800px) {
  /* Let the lesson scroll as one piece; its reading panels never compress or overlap. */
  .planet-discovery-layout { flex: 0 0 auto; grid-template-rows: 160px auto; }
  .discovery-visual { min-height: 160px; }
  .discovery-reading { height: auto; min-height: min-content; }
  .discovery-reading-content { flex: none; min-height: min-content; }
  .discovery-tabs-intro { font-size: 11px; margin-bottom: 7px; }
  .discovery-reading-tabs { gap: 6px; }
  .discovery-reading-tabs button { grid-template-columns: minmax(0, 1fr) 14px; gap: 5px; align-content: center; min-height: 64px; padding: 8px; font-size: 11px; }
  .discovery-reading-tabs button > .discovery-tab-number { width: 20px; height: 20px; font-size: 10px; }
  .discovery-reading-tabs button b { grid-column: 1 / -1; grid-row: 2; }
  .discovery-reading-tabs button > .discovery-tab-arrow { grid-column: 2; grid-row: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .discovery-reading-tabs button { transition: none; }
  .discovery-reading-tabs button:hover { transform: none; }
}
