/* Full screen belongs to the expedition, including its reading panels. */
.world-fullscreen,
.dialog-fullscreen {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 9px 12px;
  border: 1px solid #49616b;
  border-radius: 5px;
  color: #d9e8e2;
  background: #0b1822;
  font-size: 11px;
  white-space: nowrap;
}
.world-fullscreen:hover,
.dialog-fullscreen:hover { background: #1a303a; }
.dialog-actions {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 10px;
}
.dialog-top > .eyebrow { min-width: 0; }
.dialog-fullscreen { min-height: 38px; padding: 8px 11px; }
.world-fullscreen svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.app-fullscreen { overflow: hidden; }
/* The expanded information panel covers the scene; no live backdrop is needed. */
.app-fullscreen dialog::backdrop { backdrop-filter: none; }
.app-fullscreen:not(.sky-mode) .app-shell {
  position: fixed;
  inset: 0;
  height: 100%;
  min-height: 0;
  padding: 0 clamp(18px, 4.3vw, 76px);
}
.app-fullscreen:not(.sky-mode) .header {
  height: 76px;
  min-height: 76px;
  flex-shrink: 0;
  gap: clamp(12px, 1.8vw, 28px);
}
.app-fullscreen:not(.sky-mode) .main-nav { gap: clamp(14px, 1.8vw, 28px); }
.app-fullscreen:not(.sky-mode) .main {
  flex: 1;
  min-height: 0;
  padding: 20px 0;
}
.app-fullscreen:not(.sky-mode) .destination-section,
.app-fullscreen:not(.sky-mode) .footer { display: none; }
.app-fullscreen:not(.sky-mode) .destination-panel {
  max-height: 100%;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #52675f #0c1520;
  padding: 8px 10px 8px 0;
  opacity: 1;
  pointer-events: auto;
}
.app-fullscreen:not(.sky-mode) .scene-toolbar {
  top: auto;
  bottom: 24px;
}
.app-fullscreen:not(.sky-mode) .orbit-hint {
  bottom: 22px;
  left: 43%;
  right: 155px;
}
.app-fullscreen:not(.sky-mode) .location-badge { top: 24px; }

/* Higher specificity intentionally overrides the book/science/star size limits. */
.app-fullscreen .reader-dialog[open],
.app-fullscreen .info-dialog[open] {
  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: none;
  height: 100svh;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  box-sizing: border-box;
}
.app-fullscreen .reader-dialog > .dialog-top,
.app-fullscreen .reader-dialog > .reader-tabs,
.app-fullscreen .reader-dialog > .book-controls,
.app-fullscreen .reader-dialog > .reader-footer,
.app-fullscreen .info-dialog > .dialog-top { flex-shrink: 0; }
.app-fullscreen .reader-dialog > .dialog-top,
.app-fullscreen .info-dialog > .dialog-top {
  min-height: 65px;
  padding: 10px clamp(18px, 3vw, 48px);
}
.app-fullscreen .dialog-top .close-button {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
}
.app-fullscreen .reader-dialog .reader-scroll,
.app-fullscreen .info-dialog #info-content {
  flex: 1;
  min-height: 0;
  max-height: none;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 24px clamp(20px, 3vw, 52px);
}
.app-fullscreen .reader-dialog:not(.book-reader) #reader-content {
  width: 100%;
  max-width: 1280px;
  margin-inline: auto;
}
.app-fullscreen .info-dialog #info-content > * {
  max-width: 1280px;
  margin-inline: auto;
}
.app-fullscreen .book-reader .reader-scroll { padding: 8px; }
.app-fullscreen .reader-dialog .reader-footer {
  padding: 12px clamp(18px, 3vw, 48px);
}
.app-fullscreen .reader-dialog .reader-footer .button { min-height: 44px; }

@media (min-width: 1600px) {
  .world-fullscreen,
  .dialog-fullscreen { min-height: 48px; font-size: 15px; padding: 11px 16px; }
  .app-fullscreen:not(.sky-mode) .header { height: 96px; min-height: 96px; }
  .app-fullscreen .reader-dialog > .dialog-top,
  .app-fullscreen .info-dialog > .dialog-top { min-height: 78px; }
}

@media (max-width: 1050px) {
  .world-fullscreen { gap: 6px; padding: 9px 10px; }
  .app-fullscreen:not(.sky-mode) .header { gap: 12px; }
  .app-fullscreen:not(.sky-mode) .main-nav { gap: 14px; }
}

@media (max-height: 620px) and (min-width: 801px) {
  .app-fullscreen:not(.sky-mode) .header { height: 64px; min-height: 64px; }
  .app-fullscreen:not(.sky-mode) .main { padding: 10px 0; }
  .app-fullscreen:not(.sky-mode) .destination-panel h1 { font-size: 58px; margin-bottom: 10px; }
  .app-fullscreen:not(.sky-mode) .destination-panel h1.long-title { font-size: 44px; }
  .app-fullscreen:not(.sky-mode) .destination-panel h1.very-long-title { font-size: 35px; }
  .app-fullscreen:not(.sky-mode) .overline { margin: 13px 0 8px; }
  .app-fullscreen:not(.sky-mode) .fact-grid { padding: 12px 0; }
  .app-fullscreen:not(.sky-mode) .primary-actions { margin-top: 14px; }
}

@media (max-width: 800px) {
  .world-fullscreen { min-height: 38px; font-size: 10px; }
  .dialog-actions { gap: 6px; }
  .dialog-fullscreen { min-height: 38px; padding: 8px 10px; font-size: 10px; }
  .app-fullscreen:not(.sky-mode) .header {
    height: auto;
    min-height: 100px;
    padding: 10px 0;
    gap: 7px 12px;
    align-content: center;
  }
  .app-fullscreen:not(.sky-mode) .brand { font-size: 19px; }
  .app-fullscreen:not(.sky-mode) .brand-subtitle { font-size: 6px; }
  .app-fullscreen:not(.sky-mode) .main-nav {
    order: 3;
    flex-basis: 100%;
    justify-content: center;
    height: 38px;
    gap: clamp(18px, 4vw, 40px);
  }
  .app-fullscreen:not(.sky-mode) .main { align-items: flex-end; padding: 15px 0 100px; }
  .app-fullscreen:not(.sky-mode) .destination-panel { max-height: 100%; }
  .app-fullscreen:not(.sky-mode) .location-badge { top: 10px; }
  .app-fullscreen:not(.sky-mode) .scene-toolbar { top: auto; bottom: 24px; }
  .app-fullscreen:not(.sky-mode) .orbit-hint {
    bottom: 14px;
    left: 0;
    right: 145px;
    max-width: 360px;
    padding: 11px;
  }
  .app-fullscreen .reader-dialog > .dialog-top,
  .app-fullscreen .info-dialog > .dialog-top { min-height: 60px; padding: 8px 16px; }
  .app-fullscreen .reader-dialog .reader-scroll,
  .app-fullscreen .info-dialog #info-content { padding: 20px; }
  .app-fullscreen .book-reader .reader-scroll { padding: 5px; }
  .app-fullscreen .reader-dialog .reader-footer { padding: 10px 16px; }
}