/* Research-informed global shell correction.
   The approved homepage remains unchanged. All non-home routes retain a
   persistent global header and primary navigation. Research mode is compact,
   but the global navigation is hidden only by the browser's true fullscreen
   state, never during ordinary page navigation. */

body:not([data-page="home"]) {
  --header-primary-height: 76px;
  --header-nav-height: 44px;
}

body.research-page {
  --header-primary-height: 62px;
  --header-nav-height: 40px;
}

/* Persistent orientation on every desktop route. */
.site-header {
  position: sticky;
  top: 0;
  isolation: isolate;
  box-shadow: 0 1px 0 var(--line), 0 6px 18px rgba(30, 20, 39, .035);
}
html[data-theme="dark"] .site-header {
  box-shadow: 0 1px 0 var(--line), 0 8px 22px rgba(0, 0, 0, .18);
}

/* Compact—but visually identical—header for non-home pages. */
body:not([data-page="home"]) .header-primary {
  min-height: var(--header-primary-height);
  grid-template-columns: minmax(230px, 305px) minmax(320px, 1fr) auto;
  gap: 22px;
}
body:not([data-page="home"]) .brand { gap: 11px; }
body:not([data-page="home"]) .brand-emblem { width: 54px; height: 54px; }
body:not([data-page="home"]) .brand-name { font-size: clamp(27px, 2vw, 34px); }
body:not([data-page="home"]) .brand-subtitle { margin-top: 3px; font-size: 12px; }
body:not([data-page="home"]) .global-search-trigger { height: 44px; border-radius: 7px; }
body:not([data-page="home"]) .release-summary { gap: 8px; padding-left: 17px; }
body:not([data-page="home"]) .release-summary > svg { width: 28px; height: 28px; }
body:not([data-page="home"]) .release-summary strong { font-size: 14px; }
body:not([data-page="home"]) .release-summary small { font-size: 11px; }
body:not([data-page="home"]) .primary-navigation-inner {
  height: var(--header-nav-height);
  gap: clamp(28px, 4.2vw, 62px);
}
body:not([data-page="home"]) .primary-navigation a {
  min-height: var(--header-nav-height);
  font-size: 14px;
}

/* Research mode keeps the exact same global IA instead of becoming an island. */
.site-header-research .header-primary {
  min-height: var(--header-primary-height);
  grid-template-columns: minmax(210px, 270px) minmax(300px, 1fr) auto;
  gap: 18px;
}
.site-header-research .brand-emblem { width: 46px; height: 46px; }
.site-header-research .brand-name { font-size: 27px; }
.site-header-research .brand-subtitle { display: none; }
.site-header-research .global-search-trigger { height: 40px; }
.site-header-research .release-summary { display: none; }
.site-header-research .primary-navigation { display: block; }
.site-header-research .primary-navigation-inner { height: var(--header-nav-height); }
.site-header-research .primary-navigation a {
  min-height: var(--header-nav-height);
  font-size: 13px;
}

/* Sticky local navigation and scientific controls sit below the global shell. */
.site-header + .mobile-navigation + main .context-navigation,
.site-header + .mobile-navigation + main .app-page > .context-navigation {
  top: calc(var(--header-primary-height) + var(--header-nav-height));
}
.research-toolbar {
  top: calc(var(--header-primary-height) + var(--header-nav-height));
  z-index: 60;
  box-shadow: 0 5px 14px rgba(27, 18, 36, .045);
}
html[data-theme="dark"] .research-toolbar {
  box-shadow: 0 7px 18px rgba(0, 0, 0, .18);
}

/* Data pages should feel like research catalogues rather than isolated panels. */
body.catalogue-page .page-heading {
  padding-top: 20px;
  padding-bottom: 22px;
}
body.catalogue-page .page-heading h1 { font-size: clamp(36px, 3vw, 48px); }
body.catalogue-page .table-wrap,
body.catalogue-page .matrix-wrap { border-color: var(--line-strong); }
body.catalogue-page .scientific-table thead th { box-shadow: inset 0 -1px var(--line-strong); }

/* Viewer pages keep page identity compact so the scientific canvas remains
   dominant while users still know where they are in the database. */
body.research-page .breadcrumbs { min-height: 36px; font-size: 12px; }
body.research-page .page-heading,
body.research-page .sequence-header,
body.research-page .candidate-record-header { padding-top: 14px; padding-bottom: 16px; }
body.research-page .page-heading h1 { font-size: clamp(32px, 2.8vw, 45px); }

/* A true fullscreen viewer is the only state where global navigation disappears.
   Native requestFullscreen() moves the selected stage outside the document
   shell, so no class-based hiding is needed for normal browsing. */
:fullscreen {
  background: var(--surface-raised);
}
:fullscreen .research-toolbar {
  top: 0;
}

@media (max-width: 1180px) {
  body:not([data-page="home"]) {
    --header-primary-height: 70px;
    --header-nav-height: 42px;
  }
  body.research-page {
    --header-primary-height: 60px;
    --header-nav-height: 40px;
  }
  body:not([data-page="home"]) .header-primary,
  .site-header-research .header-primary {
    grid-template-columns: minmax(205px, 265px) minmax(260px, 1fr) auto;
    gap: 14px;
  }
  body:not([data-page="home"]) .brand-subtitle { display: none; }
  body:not([data-page="home"]) .release-summary small { display: none; }
  body:not([data-page="home"]) .primary-navigation-inner { gap: 28px; }
}

@media (max-width: 900px) {
  body:not([data-page="home"]) .release-summary { display: none; }
  body:not([data-page="home"]) .header-primary,
  .site-header-research .header-primary {
    grid-template-columns: minmax(200px, 245px) minmax(250px, 1fr) auto;
  }
  body:not([data-page="home"]) .primary-navigation-inner { gap: 20px; }
}

@media (max-width: 760px) {
  body:not([data-page="home"]),
  body.research-page {
    --header-primary-height: 64px;
    --header-nav-height: 0px;
  }
  body:not([data-page="home"]) .header-primary,
  .site-header-research .header-primary {
    min-height: 64px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
  }
  body:not([data-page="home"]) .brand-emblem,
  .site-header-research .brand-emblem { width: 44px; height: 44px; }
  body:not([data-page="home"]) .brand-name,
  .site-header-research .brand-name { font-size: 24px; }
  body:not([data-page="home"]) .global-search-trigger,
  .site-header-research .global-search-trigger,
  .site-header-research .primary-navigation { display: none; }
  .site-header + .mobile-navigation + main .context-navigation,
  .site-header + .mobile-navigation + main .app-page > .context-navigation,
  .research-toolbar { top: 64px; }
  .research-toolbar { max-width: 100vw; }
}