/* A single active renderer keeps maps and 3D replay within one page budget. */
.flight-experience-nav {
  --flight-nav-height: 56px;
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  min-height: var(--flight-nav-height);
  padding: 4px 6px;
  border: 1px solid var(--ui-color-border, #dbe3eb);
  border-radius: 10px;
  background: var(--ui-color-surface, #fff);
  color: var(--ui-color-text, #192f40);
  margin-bottom: 8px;
}
.flight-experience-nav a { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 6px 10px; border: 0; color: inherit; text-decoration: none; border-radius: 7px; font-size: .875rem; font-weight: 500; line-height: 1.2; box-shadow: none; }
.flight-experience-nav a:hover { background: var(--ui-color-surface-hover); color: var(--ui-color-text); }
.flight-experience-nav a:focus-visible { outline: 2px solid var(--ui-color-focus); outline-offset: 2px; }
.flight-experience-nav a[aria-current="page"] { background: var(--ui-color-surface-hover); color: var(--ui-color-primary-strong); font-weight: 600; box-shadow: none; }
.flight-experience-nav__short { display: none; }
.flight-experience-nav__views { display: flex; align-items: center; gap: 3px; min-width: 0; flex: 1; }
.flight-experience-nav__back { flex: 0 0 44px; }
.flight-experience-nav__pilot-link { color: #334155 !important; }
.flight-experience-nav__pilot-link:hover { border-color: #cbd5e1; background: #f8fafc; }
.flight-experience-nav__airspace {
  margin-left: auto;
  border: 1px solid var(--ui-color-border-strong) !important;
  background: var(--ui-color-surface-alt);
  color: var(--ui-color-primary-strong) !important;
  font-weight: 600 !important;
  box-shadow: none;
}
.flight-experience-nav__airspace:hover { border-color: var(--ui-color-primary) !important; background: var(--ui-color-surface-hover); }
.main-shell--flight-experience { --flight-experience-nav-height: 64px; }
body.page--flightmap3d .main-shell--flight-experience .main-shell__nav { display: none; }
.main-shell--flight-experience .flight-view { gap: 12px; padding-top: 0; }
.main-shell--flight-experience .flight-view__map-tool-actions { display: none; }
.main-shell--flight-experience .flightmap-v2-toolbar__title,
.main-shell--flight-experience .flightmap-v2-toolbar__button--back,
.main-shell--flight-experience .light-view-actions__brand,
.main-shell--flight-experience .light-view-action--flight,
.main-shell--flight-experience .light-view-action--stats { display: none; }
.main-shell--flight-experience .light-view-actions { padding: 6px; margin: 0; }
.main-shell--flight-experience .light-view-actions__links { gap: 4px; }
.main-shell--flight-experience .flight-view__hero { padding: clamp(12px, 2vw, 24px); }
body.page--flightmap3d .flight-experience-nav { position: fixed; inset: 0 0 auto; z-index: 1001; min-height: 56px; margin: 0; border-radius: 0; background: #172533; color: #f3f7fa; border-color: #334a60; }
.main-shell--flight-experience .flightmap-3d-root { inset: var(--flight-experience-nav-height) 0 0; height: calc(100vh - var(--flight-experience-nav-height)); height: calc(100dvh - var(--flight-experience-nav-height)); }
.main-shell--flight-experience :is(.flightmap-3d-info-stack, .flightmap-3d-panel-toggle) { position: absolute; }
.main-shell--flight-experience .flightmap-3d-panel { max-height: calc(100% - 170px); }
@media (max-width: 760px) {
  .main-shell--flight-experience .flightmap-3d-readout { position: absolute; top: 0; right: calc(-1 * var(--replay-readout-width, 116px)); }
  .main-shell--flight-experience .flightmap-3d-panel { max-height: min(56dvh, calc(100% - var(--replay-top-height) - var(--replay-chart-height) - var(--replay-chart-bottom))); }
  .main-shell--flight-experience .flightmap-3d-color-legend { max-height: calc(100dvh - var(--flight-experience-nav-height) - 210px); }
}
@media (max-height: 500px) and (max-width: 900px) {
  .main-shell--flight-experience .flightmap-3d-panel { max-height: calc(100% - var(--replay-chart-bottom) - var(--replay-top-height, 8px)); }
}
body.dark-mode .flight-experience-nav { background: #1b2c3a; color: #edf3f8; border-color: #395064; }
body.dark-mode .flight-experience-nav a[aria-current="page"] { background: var(--ui-color-surface-hover); color: var(--ui-color-primary-strong); }
body.dark-mode .flight-experience-nav__pilot-link { color: #e2e8f0 !important; }
body.dark-mode .flight-experience-nav__pilot-link:hover { border-color: #475569; background: #263c4d; }
@media (max-width: 600px) {
  .flight-experience-nav { align-items: center; gap: 2px; padding: 3px; }
  .flight-experience-nav a { gap: 4px; padding: 5px 8px; font-size: .8125rem; white-space: nowrap; }
  .flight-experience-nav__views { display: flex; flex: 1; gap: 2px; overflow-x: auto; scrollbar-width: thin; }
  .flight-experience-nav__views a { flex: 0 0 auto; flex-direction: row; text-align: left; }
  .flight-experience-nav__airspace { margin-left: 2px; }
  .flight-experience-nav__back { flex-basis: 44px; }
}

@media (max-width: 600px) {
  body.page--flightmap3d .flight-experience-nav__views { min-width: 0; overflow-x: auto; scrollbar-width: none; }
  body.page--flightmap3d .flight-experience-nav__views > a { flex: 1 1 0; min-width: 44px; max-width: none; padding-inline: 3px; overflow: hidden; }
  body.page--flightmap3d .flight-experience-nav__views .flight-experience-nav__pilot-link { flex: 0 0 44px; }
  body.page--flightmap3d .flight-experience-nav__label,
  body.page--flightmap3d .flight-experience-nav__pilot-link span { display: none; }
  body.page--flightmap3d .flight-experience-nav__short { display: inline; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.page--flightmap3d .flight-experience-nav__airspace { margin-left: 0; }
}

/* The replay's secondary map options live beside the view tabs. */
body.page--flightmap3d .flight-experience-nav__settings { position: relative; flex: 0 0 44px; }
body.page--flightmap3d .flight-experience-nav__settings-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 1px solid #4c6071;
  border-radius: 6px;
  background: #263949;
  color: #f3f7fa;
  font: inherit;
  cursor: pointer;
}
body.page--flightmap3d .flight-experience-nav__settings-toggle:hover,
body.page--flightmap3d .flight-experience-nav__settings-toggle[aria-expanded="true"] { background: #365064; }
body.page--flightmap3d .flight-experience-nav__settings-toggle:focus-visible { outline: 2px solid #83c9da; outline-offset: 2px; }
body.page--flightmap3d .flight-experience-nav__settings-panel[hidden] { display: none; }
body.page--flightmap3d .flight-experience-nav__settings-panel {
  --replay-panel: rgba(17, 24, 39, .98);
  --replay-panel-strong: #111c29;
  --replay-border: rgba(255, 255, 255, .2);
  --replay-text: #f8fafc;
  --replay-muted: #c5d1dc;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 2;
  box-sizing: border-box;
  width: min(288px, calc(100vw - 12px));
  max-height: calc(100dvh - var(--flight-experience-nav-height) - 124px);
  overflow-y: auto;
  padding: 10px;
  border: 1px solid #4c6071;
  border-radius: 6px;
  background: #172533;
  color: var(--replay-text);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .28);
}
body.page--flightmap3d .flight-experience-nav__settings-panel .flightmap-3d-color-control {
  position: static;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: none;
  gap: 8px;
  width: 100%;
  height: auto;
  min-height: 0;
  max-width: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
}
body.page--flightmap3d .flight-experience-nav__settings-panel :is(.flightmap-3d-color-control__row, .flightmap-3d-basemap-control) {
  display: grid;
  grid-column: 1;
  grid-row: auto;
  grid-template-columns: 70px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  width: 100%;
  height: auto;
  min-height: 44px;
  padding: 0;
  border: 0;
}
body.page--flightmap3d .flight-experience-nav__settings-panel .flightmap-3d-basemap-control > .flightmap-3d-color-control__label { display: inline-flex; }
body.page--flightmap3d .flight-experience-nav__settings-panel .flightmap-3d-color-control__label { gap: 6px; font-size: 13px; }
body.page--flightmap3d .flight-experience-nav__settings-panel .flightmap-3d-color-control__label span {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
  font-size: 13px;
}
body.page--flightmap3d .flight-experience-nav__settings-panel :is(.flightmap-3d-color-control select, .flightmap-3d-basemap-button) {
  box-sizing: border-box;
  width: 100%;
  height: 44px;
  min-height: 44px;
  margin: 0;
  padding: 6px 8px;
  font-size: 16px;
}
body.page--flightmap3d .flight-experience-nav__settings-panel .flightmap-3d-legend-toggle {
  grid-column: 1;
  grid-row: auto;
  height: 44px;
  min-height: 44px;
  justify-content: space-between;
  border: 1px solid var(--replay-border);
  border-radius: 4px;
}
body.page--flightmap3d .flight-experience-nav__settings-panel .flightmap-3d-color-legend {
  position: static;
  grid-column: 1;
  grid-row: auto;
  width: 100%;
  max-height: none;
  padding: 8px 0 0;
  border: 0;
  border-top: 1px solid var(--replay-border);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
body.page--flightmap3d .flight-experience-nav__settings-panel .flightmap-3d-basemap-notice {
  position: static;
  grid-column: 1;
  grid-row: auto;
  box-sizing: border-box;
  width: 100%;
}

@media (min-width: 761px) {
  body.page--flightmap3d.is-replay-settings-in-nav .flightmap-3d-panel-toggle {
    top: 8px;
    right: auto;
    left: 336px;
    width: auto;
    max-width: min(180px, calc(100vw - 344px));
    min-height: 44px;
  }
  body.page--flightmap3d.is-replay-settings-in-nav .flightmap-3d-root.is-panel-collapsed .flightmap-3d-panel-toggle { left: 8px; }
}

@media (max-width: 760px) {
  body.page--flightmap3d.is-replay-settings-in-nav .flightmap-3d-root { --replay-top-height: 76px; }
  body.page--flightmap3d.is-replay-settings-in-nav .flightmap-3d-info-stack { top: 8px; right: 8px; left: auto; width: var(--replay-readout-width); }
  body.page--flightmap3d.is-replay-settings-in-nav .main-shell--flight-experience .flightmap-3d-readout {
    position: static;
    flex: 0 0 auto;
    box-sizing: border-box;
    width: 100%;
    height: 60px;
    min-height: 60px;
    padding: 5px 7px;
    border: 1px solid var(--replay-border);
    border-radius: 4px;
  }
  body.page--flightmap3d.is-replay-settings-in-nav .flightmap-3d-panel-toggle,
  body.page--flightmap3d.is-replay-settings-in-nav .flightmap-3d-root.is-panel-collapsed .flightmap-3d-panel-toggle {
    top: 8px;
    right: auto;
    left: 8px;
    width: auto;
    min-width: 112px;
    height: 44px;
    min-height: 44px;
    padding: 0 8px;
    border: 1px solid var(--replay-border);
    border-radius: 4px;
  }
}

@media (max-width: 360px) {
  body.page--flightmap3d .flight-experience-nav__views > a { font-size: 12px; }
  body.page--flightmap3d .flight-experience-nav__views .flight-experience-nav__airspace { letter-spacing: -.02em; }
}

/* Story and analysis use the normal BeyondXC page frame and shared surfaces. */
body.page--flightmap:has(.main-shell--flight-experience) {
  background: var(--ui-color-bg, #f6f7f9);
}
body.page--flightmap .main-shell--flight-experience { display: flex; }
body.page--flightmap .main-shell--flight-experience .main-shell__nav { display: block !important; }
body.page--flightmap:has(.main-shell--flight-experience) :is(.site-footer, .tra-nav-footer, .sponsor-banner) { display: block !important; }
body:not(.page--flightmap3d) .main-shell--flight-experience .view-routing {
  box-sizing: border-box;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 12px;
}
body:not(.page--flightmap3d) .main-shell--flight-experience .flight-experience-nav { margin-bottom: 14px; }
.flight-experience-heading { margin: 0 0 12px; color: var(--ui-color-text); }
.flight-experience-heading h1 { margin: 0; font-size: clamp(1.25rem, 2.2vw, 1.65rem); line-height: 1.25; }
.flight-experience-heading p { margin: 5px 0 0; color: var(--ui-color-text-muted); font-size: .875rem; line-height: 1.45; }
.main-shell--flight-experience .flightmap-v2-toolbar {
  position: static;
  display: flex;
  padding: 0 0 10px;
  background: transparent;
  border: 0;
  backdrop-filter: none;
}
.main-shell--flight-experience .flightmap-v2-toolbar__nav { flex-wrap: wrap; overflow: visible; gap: 6px; }
.main-shell--flight-experience .flightmap-v2-toolbar__button { min-height: 44px; box-shadow: none; font-size: .875rem; }
.main-shell--flight-experience .flightmap-v2 .light-view-actions .light-view-action:is(.light-view-action--flight, .light-view-action--stats, .light-view-action--replay) { display: none !important; }
.main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) {
  --left-panel-width: clamp(270px, 25vw, 320px);
  min-height: 0;
  padding: 0;
  gap: 12px;
  background: transparent;
}
.main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) :is(.left-panel, .left-wrapper, .chart-table-container) { background: var(--ui-color-surface); }
.main-shell--flight-experience .flightmap-v2 :is(.left-panel, .chart-panel, .map-wrapper, .flightmap-v2-side-overview) {
  border-color: var(--ui-color-border);
  border-radius: 12px;
  box-shadow: 0 3px 12px rgba(15, 23, 42, .04);
}
.main-shell--flight-experience .flightmap-v2-side-overview { padding: 12px; gap: 10px; color: var(--ui-color-text); background: var(--ui-color-surface); }
.main-shell--flight-experience .flightmap-v2-side-overview__pilot strong { font-size: 1.1rem; }
.main-shell--flight-experience .flightmap-v2-side-overview__metric strong { font-size: 1.05rem; }
.main-shell--flight-experience .flightmap-v2-side-overview :is(small, .flightmap-v2-side-overview__metric span) { line-height: 1.4; }
.main-shell--flight-experience .flightmap-v2 #upload-controls-overlay { margin: 0; background: transparent; }
.main-shell--flight-experience .flightmap-v2 .loading-message-container {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--ui-color-border);
  border-radius: 10px;
  background: var(--ui-color-surface-alt);
  color: var(--ui-color-text);
  box-shadow: none;
}
.main-shell--flight-experience .flightmap-v2 .loading-message { font: inherit; font-size: .875rem; line-height: 1.45; overflow-wrap: anywhere; }
.main-shell--flight-experience .flightmap-v2 .upload-status-panel {
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--ui-color-border);
  border-radius: 10px;
  background: var(--ui-color-surface);
  color: var(--ui-color-text);
  box-shadow: none;
}
.main-shell--flight-experience .flightmap-v2 .status-progress { width: 48px; height: 48px; }
.main-shell--flight-experience .flightmap-v2 .status-details { min-width: 0; gap: 5px; overflow-wrap: anywhere; }
.main-shell--flight-experience .flightmap-v2 :is(.status-progress-label, .status-title, .status-step-name) { color: var(--ui-color-text); }
.main-shell--flight-experience .flightmap-v2 :is(.status-subtitle, .status-step-message) { color: var(--ui-color-text-muted); }
.main-shell--flight-experience .flightmap-v2 .altitude-chart-toggles {
  background: var(--ui-color-surface-alt);
  border: 0;
  border-radius: 10px 10px 0 0;
}
.main-shell--flight-experience .flightmap-v2 .altitude-chart-toggles .toggle-pill { color: var(--ui-color-text); background: var(--ui-color-surface); border-color: var(--ui-color-border); }
.flight-experience-story {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 12px 0;
  padding: 16px;
  border: 1px solid var(--ui-color-border);
  border-radius: 12px;
  background: var(--ui-color-surface);
  color: var(--ui-color-text);
}
.flight-experience-story__body { flex: 1; min-width: 0; }
.flight-experience-story__eyebrow { color: var(--ui-color-text-muted); font-size: .8125rem; overflow-wrap: anywhere; }
.flight-experience-story h2 { font-size: 1.1rem; line-height: 1.35; margin: 4px 0; }
.flight-experience-story p { font-size: .9375rem; line-height: 1.5; margin: 0; overflow-wrap: anywhere; }
.flight-experience-story__actions { display: flex; flex-wrap: wrap; gap: 6px; flex: 0 1 300px; }
.flight-experience-story__actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; gap: 7px; padding: 5px 10px; border: 1px solid var(--ui-color-border); border-radius: 8px; font-size: .875rem; color: var(--ui-color-text); text-decoration: none; }
.flight-experience-story__actions .flight-experience-story__open { flex-basis: 100%; background: #245be8; border-color: #245be8; color: #fff; }
.flight-experience-story__actions a:focus-visible { outline: 3px solid #60a5fa; outline-offset: 2px; }
@media (max-width: 992px) {
  .main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) .center-panel { grid-row: 1; order: 1; }
  .main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) .left-panel { grid-row: 2; order: 2; border: 1px solid var(--ui-color-border); }
  .main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) .map-wrapper { height: clamp(360px, 55dvh, 520px); }
  .main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) .analysis-layout { gap: 10px; }
}
@media (max-width: 600px) {
  body:not(.page--flightmap3d) .main-shell--flight-experience .view-routing { padding: 8px; }
  .flight-experience-story { display: block; padding: 12px; }
  .flight-experience-story__actions { margin-top: 10px; }
  .flight-experience-nav a { font-size: .8125rem; min-width: 0; overflow-wrap: anywhere; }
  .flight-experience-nav__back { flex-basis: 36px; min-width: 44px !important; padding-inline: 0 !important; }
}

.flight-experience-summary:empty { display: none; }
.flight-experience-summary { margin-bottom: 10px; }
.flight-experience-summary .flightmap-v2-side-overview { box-shadow: none; border-radius: 12px; }
.flight-experience-summary .flightmap-v2-side-overview__metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.flight-experience-summary :is(.flightmap-v2-side-overview__pilot span, .flightmap-v2-side-overview__metric span, .flightmap-v2-side-overview__countries-title, .flightmap-v2-side-overview__pilot small, .flightmap-v2-side-overview__metric small, .flightmap-v2-side-overview__country, .flightmap-v2-side-overview__badge) { font-size: .8125rem; line-height: 1.35; text-transform: none; }
.flight-experience-summary :is(strong, small) { overflow-wrap: anywhere; white-space: normal; }
.flight-experience-summary .flightmap-v2-side-overview__countries { display: flex; align-items: center; gap: 8px; }
.main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) .altitude-chart-wrapper { flex: 0 0 240px; height: 240px; min-height: 0; }
.main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) #altitude-chart-container { height: 240px !important; min-height: 0; }
@media (max-width: 600px) {
  .flight-experience-summary .flightmap-v2-side-overview__metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .flight-experience-summary .flightmap-v2-side-overview__hero { grid-template-columns: minmax(0, 1fr) auto; }
  .flight-experience-summary .flightmap-v2-side-overview__badge { white-space: normal; max-width: 110px; }
}

.main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) .altitude-scale-controls { box-sizing: border-box; height: 100%; min-height: 0; }
.main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) .altitude-scale-controls__sliders { height: 100%; min-height: 0; gap: 10px; }
.main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) .altitude-scale-controls__slider { min-height: 0; gap: 3px; }
.main-shell--flight-experience .flightmap-v2:not(.is-fullscreen) .altitude-scale-input { flex: 1 1 0; min-height: 0; height: 0; }
