/* ORBITAL · Presentación principal. No cambia los cálculos ni los materiales 3D.
 * 1. Paleta  2. Cabecera y destinos  3. Visor y datos  4. Mandos y tiempo
 * Los paneles de exploración están en orbital-detalles.css. Sin recursos remotos. */
body.orbital-theme {
  --orbital-accent: #e9bb75;
  --orbital-surface: #101719;
  --orbital-line: #3b4549;
  --orbital-muted: #a5adae;
  --page: #080d10; --panel: #101719; --line: #3b4549;
  --text: #e9ecec; --muted: #a5adae; --gold: #e9bb75;
  --blue: #abd2df; --green: #a4ccb4; --violet: #d5c4a8; --radius: 6px;
  background: radial-gradient(ellipse 60% 260px at 12% 0%, #87704915, transparent), #080d10;
  color: var(--text);
  font-family: 'Segoe UI', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.orbital-theme .app { max-width: 2000px; padding: 0 26px 22px; }
.orbital-theme .header { min-height: 76px; margin: 0; padding: 13px 0; border-bottom: 1px solid #6c757533; gap: 20px; }
.orbital-brand { display: flex; align-items: center; gap: 14px; }
.orbital-mark { width: 49px; height: 40px; flex: 0 0 49px; fill: none; stroke: var(--orbital-accent); stroke-width: 1.5; }
.orbital-theme .header h1 { margin: 0; font-size: 21px; font-weight: 450; letter-spacing: .19em; text-transform: uppercase; }
.orbital-theme .header h1 span { display: inline-block; margin-left: 14px; padding-left: 17px; border-left: 1px solid #60696e; color: var(--orbital-accent); font-size: 11px; font-weight: 500; letter-spacing: .25em; vertical-align: middle; }
.orbital-subtitle { margin: 4px 0 0; color: var(--orbital-muted); font-size: 10px; letter-spacing: .06em; }
.orbital-theme .header-right { gap: 16px; }
.orbital-theme .status { border: 0; border-radius: 0; padding: 6px 0; color: var(--orbital-accent); background: transparent; font-size: 12px; }
.orbital-theme .status[data-mode] { background: transparent; }
.orbital-theme .header .button { min-height: 34px; padding: 7px 12px; font-size: 11px; }
.orbital-theme .button, .orbital-theme select, .orbital-theme input:not([type='checkbox']):not([type='range']) {
  border-radius: 5px; border-color: var(--orbital-line); background: #151d21; color: #e9ecec;
}
.orbital-theme .button:hover { background: #252a29; border-color: #b39462; }
.orbital-theme .button.primary { background: var(--orbital-accent); color: #211b13; border-color: #f0ce9a; box-shadow: 0 2px 18px #c2944120; }
.orbital-theme :is(button, input, select, summary, a):focus-visible { outline: 2px solid #f5ce92; outline-offset: 3px; }
.orbital-theme input[type='checkbox'], .orbital-theme input[type='range'] { accent-color: var(--orbital-accent); }

/* 2. Destinos: la misma información en una barra compacta. */
.orbital-theme .view-toolbar { gap: 0; margin: 0; }
.orbital-theme .view-toolbar .explore-actions { grid-template-columns: 1.4fr repeat(5, 1fr); gap: 0; margin: 0; border-bottom: 1px solid #6c757533; }
.orbital-theme .view-toolbar .explore-actions > button,
.orbital-theme .view-toolbar #destination-menu-toggle {
  min-height: 62px; padding: 10px 16px; gap: 12px; flex-direction: row;
  border: 0; border-bottom: 2px solid transparent; border-radius: 0;
  background: transparent; color: #bac2c5; box-shadow: none;
  transition: background 150ms, color 150ms, border-color 150ms;
}
.orbital-theme .view-toolbar .explore-actions > button:hover,
.orbital-theme .view-toolbar #destination-menu-toggle:hover { background: #c6a1650d; color: #fff; }
.orbital-theme .view-toolbar .explore-actions > button.selected,
.orbital-theme .view-toolbar #destination-menu-toggle.selected,
.orbital-theme .view-toolbar #destination-menu-toggle[aria-expanded='true'] {
  border-bottom-color: var(--orbital-accent); color: #fff1d9; background: linear-gradient(0deg, #b4905017, transparent);
}
.orbital-theme .view-toolbar .explore-copy strong { font-size: 13px; font-weight: 500; }
.orbital-theme .view-toolbar .explore-copy small { color: #9ba7ab; font-size: 10px; }
.orbital-theme .view-toolbar .explore-icon { width: 26px; height: 26px; flex-basis: 26px; }
.orbital-theme .view-toolbar .explore-planets { background: none; border: 1px solid var(--orbital-accent); box-shadow: none; }
.orbital-theme .view-toolbar .explore-planets::after { border-color: var(--orbital-accent); border-width: 1px; }
.orbital-theme .explore-surface, .orbital-theme .explore-sky { color: #c5bea6; }
.orbital-theme .view-toolbar #destination-menu-toggle .destination-menu-chevron { border-color: #c7b790; }
.orbital-theme .view-options { padding: 9px 0; gap: 7px 12px; }
.orbital-theme .view-options .comparison-actions button, .orbital-theme .view-options #immersive-toggle {
  min-height: 32px; border-radius: 4px; background: #0e161a; border-color: #3b4549; color: #bbc7cc; font-size: 11px;
}
.orbital-theme .view-options .comparison-actions button[aria-pressed='true'] { background: #e9bb7512; border-color: #a98b5877; color: #edc78e; }
.orbital-theme .comparison-actions svg { stroke: #cdbb9a; }
.orbital-theme .shared-instant { margin: 0 0 9px; font-size: 11px; color: #a3adaf; }
.orbital-theme .destination-menu-panel { background: #10191df7; border: 1px solid #756749; border-radius: 5px; color: #edf0ef; scrollbar-color: #81704f #10191d; box-shadow: 0 18px 60px #000b; }
.orbital-theme .view-toolbar .destination-menu-panel button { background: #192126; border-color: #3b4549; color: #e9ecec; border-radius: 4px; }
.orbital-theme .view-toolbar .destination-menu-panel button:hover { background: #333027; border-color: #e9bb7580; }
.orbital-theme .view-toolbar .destination-menu-panel button:is([aria-current='true'], [aria-pressed='true'], .selected) { background: #393022; border-color: #c9a669; color: #ffe1ac; }
.orbital-theme .view-toolbar .destination-menu-panel .destination-menu-shortcuts button { background: #28271f; border-color: #7d694955; }
.orbital-theme .destination-menu-group { border-radius: 5px; background: #ffffff03; border-color: #3b4549; }
.orbital-theme .destination-menu-group > summary { color: #e9ecec; border-radius: 5px; }
.orbital-theme .destination-menu-group > summary:hover { background: #e9bb7512; }
.orbital-theme .destination-menu-group small, .orbital-theme .destination-menu-results { color: #a5adae; }
.orbital-theme .menu-section-icon { color: var(--orbital-accent); }

/* 3. Un escenario amplio y lecturas discretas. Las miniaturas siguen calculándose. */
.orbital-theme .observation-layout { gap: 0; grid-template-columns: minmax(0, 1fr) 238px; border: 1px solid #444e51; border-radius: 6px; background: #090f13; overflow: clip; }
.orbital-theme .scene-shell { background: radial-gradient(ellipse at 48% 50%, #131d27, #080f16 68%, #05090d); box-shadow: none; border: 0; border-radius: 0; }
.orbital-theme #observatory-stage:not(.is-immersive) .observation-layout .scene-shell { height: clamp(440px, calc(100dvh - 262px), 830px); min-height: 440px; flex: 1; }
.orbital-theme #observatory-stage:not(.is-immersive) .observation-layout { align-items: stretch; }
.orbital-theme .live-readings { display: flex; flex-direction: column; gap: 0; padding: 17px 17px 12px; border: 0; border-left: 1px solid #424b4d; border-radius: 0; background: linear-gradient(140deg, #101a20f2, #0b1115); }
.orbital-theme .instant-card { padding: 0 0 15px; border: 0; border-bottom: 1px solid #384146; border-radius: 0; background: transparent; }
.orbital-theme .instant-card .eyebrow { font-size: 9px; letter-spacing: .18em; color: #c6b38d; }
.orbital-theme .instant-dot { background: var(--orbital-accent); }
.orbital-theme .instant-card .date-display { color: #d0d6d6; font-size: 11px; }
.orbital-theme .instant-card .clock-display { margin: 5px 0; font-size: 29px; font-weight: 300; letter-spacing: .02em; color: #f0d3a6; }
.orbital-theme .instant-card #time-zone { color: #98a6ab; font-size: 10px; }
.orbital-theme .current-distances { gap: 0; padding: 6px 0; }
.orbital-theme .current-distance { padding: 10px 0; border: 0; border-radius: 0; background: transparent; }
.orbital-theme .current-distance > span { color: #a7b2b5; font-size: 11px; }
.orbital-theme .current-distance strong { color: #e2e9e8; font-size: 16px; font-weight: 500; }
.orbital-theme .sun-distance-card strong { color: #e7c898; }
.orbital-theme .current-moon-card { padding: 15px 0 8px; background: transparent; border: 0; border-top: 1px solid #384146; border-radius: 0; }
.orbital-theme .current-moon-picture { width: 124px; height: 124px; margin-bottom: 12px; }
.orbital-theme .current-moon-card #moon-phase-name { color: #adb9bd; font-size: 12px; }
.orbital-theme .current-moon-card #moon-fraction { color: #f3e4cc; font-size: 18px; font-weight: 500; }
.orbital-theme .current-moon-description, .orbital-theme .current-body-kind { color: #a5adae; }
.orbital-theme .current-body-card .current-body-name { color: #eee2ce; font-size: 19px; font-weight: 500; }
.orbital-theme .current-body-facts dt { color: #a7b2b5; }
.orbital-theme .current-body-facts dd { color: #e2e9e8; font-size: 13px; }
.orbital-theme .current-body-facts > div { border-color: #384146; }
.orbital-theme .current-body-card .current-body-details { background: #d6b16f0c; border-color: #9a7c5066; border-radius: 4px; color: #e8c898; min-height: 34px; }
.orbital-theme .live-readings #guide-legend { background: #192723; color: #b7ccbf; border-radius: 4px; margin-top: 7px; }
.orbital-theme .scene-footer { left: 14px; right: 14px; bottom: 10px; padding: 8px 10px; border: 1px solid #5d686b3b; border-radius: 3px; color: #a4b0b8; background: #071017b3; font-size: 10px; }
.orbital-theme .scene-footer > span:first-child { color: #c8cfce; }
.orbital-theme .scene-overlays { top: 16px; right: 16px; background: #080f14a3; border-color: #9ca7ab38; border-radius: 4px; backdrop-filter: blur(7px); padding: 6px 11px; }
.orbital-theme .scene-overlays .check { color: #dce0dd; font-size: 12px; min-height: 33px; }
.orbital-theme .scene-overlays input { accent-color: var(--orbital-accent); width: 16px; height: 16px; flex-basis: 16px; }
.orbital-theme .body-label { border: 1px solid #85939355; border-radius: 4px; background: #071016ba; color: #e7e9e4; }
.orbital-theme #view-explanation { margin: 0; border: 0; border-top: 1px solid #384146; border-radius: 0; background: #111a1d; }
.orbital-theme #view-explanation > summary { color: #d2c2a3; }
.orbital-theme #view-explanation .summary-icon { color: #e4bb7f; }

/* 4. El mando sigue siendo plegable; los botones conservan un tamaño cómodo. */
.orbital-theme .camera-pad { left: 16px; bottom: 56px; width: 152px; color: #e2e5df; }
.orbital-theme .camera-pad details { border-radius: 5px; border-color: #98a5a74a; background: #091218af; box-shadow: 0 6px 24px #0003; }
.orbital-theme .camera-pad summary { color: #ddd8c9; font-weight: 500; }
.orbital-theme .camera-pad summary::after { color: #ddc28f; }
.orbital-theme .camera-pad button { border-radius: 4px; border-color: #697a7d55; background: #a0b4b710; color: #dae2df; }
.orbital-theme .camera-pad button:hover, .orbital-theme .camera-pad button.pressed { background: #e9bb7533; border-color: #e9bb7588; }
.orbital-theme .camera-pad-modes button[aria-pressed='true'] { background: #e9bb7522; color: #ffe1ad; border-color: #d3b0717a; }
.orbital-theme .camera-pad-buttons { border: 1px solid #8f9d9d50; border-radius: 50%; margin: 8px 0; padding: 4px 0; background: radial-gradient(circle, #27353b44, transparent); }
.orbital-theme .camera-pad-buttons button { border-color: transparent; background: transparent; }
.orbital-theme .camera-pad .pad-center { color: #e2c491; border: 1px solid #d6b77e66; border-radius: 50%; }
.orbital-theme .camera-pad-hint { color: #a5adae; }
.orbital-theme .orientation-map details, .orbital-theme .lunar-map details { background: #0a141ce6; border-color: #63727766; border-radius: 4px; }
.orbital-theme .orientation-map summary { color: #d1c8b1; font-weight: 500; }
.orbital-theme .time-console { margin-top: 10px; border: 1px solid #5b625c77; border-radius: 5px; background: linear-gradient(100deg, #1c201f, #0e181d); }
.orbital-theme .time-console .timeline { background: transparent; padding: 12px 16px; gap: 16px; }
.orbital-theme .timeline .button { min-height: 38px; font-size: 12px; }
.orbital-theme .time-console label, .orbital-theme .time-console .timeline-hint { color: #a5adae; }
.orbital-theme .time-console .time-travel { border-color: #53605d44; }
.orbital-theme .time-travel > summary { color: #ddc594; }
.orbital-theme .time-travel > summary small { color: #a5adae; }
.orbital-theme .time-travel > summary::before { color: #e9bb75; }
.orbital-theme .audio-controls, .orbital-theme .audio-controls.audio-on { border-radius: 4px; border-color: #86744f88; background: #e9bb7509; color: #ead2a9; }
.orbital-theme .audio-controls > button, .orbital-theme .audio-controls > .audio-settings { border-radius: 3px; border-color: #86744f66; }
.orbital-theme .audio-controls button:hover { background: #4f442855; }
.orbital-theme .audio-popover { border-radius: 5px; border-color: #8d794f; background: #131d22fa; color: #e9ecec; }
.orbital-theme .audio-popover button { background: #202b2e; border-color: #4f5c5f; color: #e2e8e4; border-radius: 4px; }
.orbital-theme .audio-popover .audio-play-music { background: #483e2b; border-color: #af915f; color: #ffe4b8; }
.orbital-theme .audio-popover .audio-switch { color: #e9ecec; }
.orbital-theme .audio-popover :is(.audio-status, .audio-volume, .audio-note, .audio-progress) { color: #adb9bd; }
.orbital-theme .immersive-toolbar { background: #10191df5; border-color: #84704777; }
.orbital-theme .immersive-toolbar :is(button, select) { background: #202928; color: #e9dcc3; border-color: #706747; }
.orbital-theme #observatory-stage.is-immersive .observation-layout { border: 0; border-radius: 0; }
.orbital-theme #observatory-stage.is-immersive .scene-shell { height: 100%; min-height: 0; }

/* En pantallas pequeñas, los datos bajan de fila y todos los accesos se conservan. */
@media (max-width: 1100px) {
  .orbital-theme .app { padding-inline: 16px; }
  .orbital-theme .view-toolbar .explore-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .orbital-theme .view-toolbar .explore-actions > button, .orbital-theme .view-toolbar #destination-menu-toggle { min-height: 54px; padding: 8px 12px; }
  .orbital-theme .observation-layout { grid-template-columns: minmax(0, 1fr) 212px; }
  .orbital-theme .live-readings { padding-inline: 13px; }
  .orbital-theme .observation-layout:has(.split-view) { grid-template-columns: minmax(0, 1fr); }
  .orbital-theme .observation-layout:has(.split-view) .live-readings { display: grid; grid-template-columns: 1fr 1fr 1.2fr; border-left: 0; border-top: 1px solid #384146; gap: 15px; }
  .orbital-theme .observation-layout:has(.split-view) .instant-card { border: 0; }
  .orbital-theme .observation-layout:has(.split-view) .current-moon-card { border: 0; padding: 0; }
}
@media (max-width: 760px) {
  .orbital-theme .app { padding-inline: 10px; }
  .orbital-theme .header { gap: 10px; min-height: 70px; }
  .orbital-theme .header h1 { font-size: 16px; letter-spacing: .12em; }
  .orbital-theme .header h1 span { display: block; border: 0; padding: 0; margin: 4px 0 0; font-size: 9px; }
  .orbital-subtitle { display: none; }
  .orbital-mark { width: 35px; flex-basis: 35px; }
  .orbital-brand { gap: 8px; }
  .orbital-theme .header-right { gap: 7px; flex-wrap: wrap; justify-content: flex-end; }
  .orbital-theme .header .button { font-size: 10px; padding: 6px 8px; }
  .orbital-theme .header .status { font-size: 10px; }
  .orbital-theme .view-toolbar .explore-copy strong { font-size: 11px; }
  .orbital-theme .view-toolbar .explore-copy small { display: none; }
  .orbital-theme .view-toolbar .explore-actions > button, .orbital-theme .view-toolbar #destination-menu-toggle { min-height: 50px; padding: 8px 6px; gap: 7px; }
  .orbital-theme .view-toolbar .explore-icon { width: 22px; height: 22px; flex-basis: 22px; }
  .orbital-theme .view-options { gap: 7px; }
  .orbital-theme .view-options .audio-controls { margin-left: 0; }
  .orbital-theme .view-options #immersive-toggle { margin-left: auto; }
  .orbital-theme .observation-layout { grid-template-columns: minmax(0, 1fr); }
  .orbital-theme #observatory-stage:not(.is-immersive) .observation-layout .scene-shell { height: 62dvh; min-height: 460px; }
  .orbital-theme .live-readings, .orbital-theme .observation-layout:has(.split-view) .live-readings { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; padding: 12px; border-left: 0; border-top: 1px solid #384146; }
  .orbital-theme .instant-card { display: grid; grid-template-columns: 1fr auto; grid-column: 1 / -1; gap: 0 10px; padding: 0 0 9px; }
  .orbital-theme .instant-card .clock-display { grid-column: 2; grid-row: 1 / 3; font-size: 26px; margin: 0; }
  .orbital-theme .instant-card #time-zone { grid-column: 1 / -1; }
  .orbital-theme .current-distances { grid-column: 1; padding: 0; }
  .orbital-theme .current-moon-card, .orbital-theme .observation-layout:has(.split-view) .current-moon-card { grid-column: 2; grid-template-columns: 1fr; border: 0; padding: 0; }
  .orbital-theme .current-moon-picture { width: 84px; height: 84px; margin-bottom: 6px; }
  .orbital-theme .live-readings :is(#guide-legend, #eclipse-reading) { grid-column: 1 / -1; }
  .orbital-theme .scene-overlays { top: 10px; left: 10px; right: 10px; grid-template-columns: 1fr 1fr; padding: 4px 8px; gap: 0 8px; }
  .orbital-theme .scene-overlays .check { font-size: 11px; min-height: 34px; }
  .orbital-theme .scene-overlays .check:last-child { grid-column: auto; }
  .orbital-theme .camera-pad { left: 10px; }
  .orbital-theme .time-console .timeline { padding: 10px; gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .orbital-theme .view-toolbar button { transition: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .orbital-theme :is(.scene-overlays, .camera-pad details, .orientation-map details) { background: #10191d; backdrop-filter: none; }
}
/* Lecciones y cielo local: mismos controles y colores científicos dentro del marco Orbital. */
.orbital-theme #lesson-dock .tour-content { background: linear-gradient(110deg,#23241f,#101c23); border-color:#756749; border-left-color:#e9bb75; border-radius:5px; }
.orbital-theme #lesson-dock .tour-step-header h3 { color:#f2e7d4; }
.orbital-theme #lesson-dock .tour-progress { color:#d8bb8a; }
.orbital-theme #lesson-dock .tour-explanation { color:#d4dddd; }
.orbital-theme #lesson-dock .tour-step-chip { background:#1a2428; border-color:#586568; color:#d8dfdf; border-radius:4px; }
.orbital-theme #lesson-dock .tour-step-chip[aria-current='step'] { background:#463c29; color:#ffe4b6; border-color:#c7a368; }
.orbital-theme #lesson-dock .tour-step-chip:hover:not(:disabled) { background:#37372e; border-color:#c7a368; }
.orbital-theme #lesson-dock .tour-step-number { background:#6a71652b; color:#e5c48c; }
.orbital-theme .lesson-sky { border-color:#3b4549; background:#111b20; border-radius:5px; }
.orbital-theme .lesson-sky > summary { color:#c8d4d4; }
.orbital-theme .lesson-light-aid { background:#101d24; border-color:#58615b; border-radius:5px; }
.orbital-theme #sky-section { background:#0e171c; border-color:#3b4549; border-radius:5px; }
.orbital-theme #sky-section :is(.sky-panorama-panel,.sky-moon-panel) { border-color:#3b4549; border-radius:5px; background:#172328; }
.orbital-theme #sky-section :is(.sky-panorama-meta,.sky-panorama-footer) { background:#111b21; color:#a9babc; }
.orbital-theme #sky-section .sky-heading h2 { color:#e9e4d9; font-weight:500; }
.orbital-theme #sky-section .sky-actions button { background:#253a38; border-color:#5b8179; color:#d3e5dc; border-radius:4px; }
.orbital-theme .sky-visibility { color:#adccba; }
.orbital-theme #comparison-help { color:#cab890; }
.orbital-theme .scene-shell .planet-place-info { border-radius:5px; border-color:#746246; background:#131d23f5; }
.orbital-theme .scene-shell :is(.planet-place-label,.lunar-site-label) { border-radius:4px; }
/* Dentro de una vista doble el ancho del visor, no el de la pantalla, manda. */
@container (max-width:540px) {
  .orbital-theme .scene-shell .scene-overlays { top:10px; left:10px; right:10px; grid-template-columns:1fr 1fr; padding:4px 8px; }
  .orbital-theme .scene-shell .scene-overlays .check { min-height:34px; font-size:11px; }
  .orbital-theme .scene-shell .scene-overlays .check:last-child { grid-column:auto; }
}
@media (pointer:coarse) {
  .orbital-theme .scene-overlays .check { min-height:44px; }
  .orbital-theme .view-options .comparison-actions button,
  .orbital-theme .view-options #immersive-toggle,
  .orbital-theme .audio-controls > button { min-height:40px; }
}
