/* Archive museum layer — static legacy pages */

:root {
  --archive-museum-bg: #1a1d24;
  --archive-museum-fg: #e8eaef;
  --archive-museum-accent: #7eb8da;
  --archive-museum-muted: #9aa3b2;
}

html {
  scroll-padding-top: 0;
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif;
  font-size: clamp(0.95rem, 0.9rem + 0.35vw, 1.05rem);
  line-height: 1.55;
  color: inherit;
  /* Legacy centering: many pages rely on align=left/right combos. */
  text-align: center;
}

.archive-museum-topbar {
  position: sticky;
  top: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  min-height: var(--archive-museum-bar-h);
  padding: 0.35rem 1rem;
  box-sizing: border-box;
  background: var(--archive-museum-bg);
  color: var(--archive-museum-fg);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  font-size: 0.9rem;
  letter-spacing: 0.02em;
}

.archive-museum-topbar-inner {
  max-width: 72rem;
  margin: 0 auto;
  width: 100%;
}

.archive-museum-topbar-inner strong {
  color: var(--archive-museum-accent);
  font-weight: 600;
}

body.archive-museum-padded {
  padding-top: 0;
}

.archive-museum-shim {
  display: inline-block;
  flex: 0 0 auto;
}

.archive-museum-umslider {
  position: relative;
  z-index: 10000;
  pointer-events: auto;
  box-sizing: border-box;
  padding: 8px 10px;
  background: #ffffcc;
  border: 1px solid #d8d0c8;
  color: #000099;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  line-height: 1.25;
}

.archive-museum-umslider-group {
  margin: 6px 0 4px;
  padding: 2px 0;
  font-weight: 700;
  color: #990000;
}

.archive-museum-umslider-list {
  list-style: none;
  padding: 0;
  margin: 0 0 6px;
}

.archive-museum-umslider-list li {
  margin: 0;
  padding: 0;
}

.archive-museum-umslider-list a {
  position: relative;
  z-index: 1;
  display: block;
  padding: 2px 0;
  color: #000099;
  text-decoration: none;
  pointer-events: auto;
}

.archive-museum-umslider-list a:hover,
.archive-museum-umslider-list a:focus-visible {
  text-decoration: underline;
}

img,
embed,
object,
video {
  max-width: 100%;
  height: auto;
}

table {
  max-width: 100%;
}

/* Legacy Dreamweaver pages: center fixed-width table layouts */
body > table[width="760"] {
  width: min(760px, 100%);
  margin-inline: auto;
  position: relative;
  text-align: left;
}

/* Many inner pages use a second 760px table inside a right-aligned wrapper. Center it too. */
div[align="right"] > table[width="760"][align="left"],
div[align="right"] > table[width="760"] {
  margin-inline: auto;
  float: none !important;
  text-align: left;
}

/* align="left" on tables can behave like a float in some modes; neutralize it. */
table[align="left"] {
  float: none !important;
  margin-inline: auto !important;
}

/* Dreamweaver "Layer" banner overlays should not block clicks in the main content below */
#Layer1,
#Layer2,
#Layer1 *,
#Layer2 * {
  pointer-events: none !important;
}

/* Modern video player (HTML5) */
.archive-museum-video {
  display: block;
  width: min(100%, 960px);
  max-width: 100%;
  height: auto;
  margin: 0.75rem auto 0.25rem;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 10px;
  background: #0b0d12;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
}

.archive-museum-video::poster {
  object-fit: cover;
}

.archive-museum-video-missing {
  max-width: min(100%, 960px);
  margin: 0.75rem auto 0.25rem;
  padding: 0.9rem 1rem;
  border-radius: 10px;
  border: 1px dashed rgba(0, 0, 0, 0.2);
  background: rgba(0, 0, 0, 0.04);
  color: #333;
  font: 0.95rem/1.45 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  text-align: left;
}

/* Opt out of responsive scaling for sliced-table layouts (prevents menu misalignment) */
body > table[width="760"] table,
body > table[width="760"] img {
  max-width: none;
}

/* Sliced top navigation only: prevent baseline gaps without breaking other slices */
img[name^="Nav_3_"],
img[name^="Nav_3_r"] {
  display: block;
}

/* Also ensure the nav table cells don't introduce 1px gaps */
body > table[width="760"] table[width="760"] td {
  line-height: 0;
  font-size: 0;
}

pre,
code {
  overflow-x: auto;
  word-break: break-word;
}

/* Legacy homepage: remove default H2 spacing that drops the left hero slice */
body > table[width="760"] > tbody > tr:nth-child(2) > td:first-child h2 {
  margin: 0;
  padding: 0;
}

/* Legacy homepage: keep the hero row top-aligned across both cells. */
body > table[width="760"] > tbody > tr:nth-child(2) > td {
  vertical-align: top;
}

img[src*="deepecology_3_r1_c1.gif"] {
  display: block;
}

@media (max-width: 40rem) {
  .archive-museum-topbar {
    font-size: 0.82rem;
    padding-inline: 0.65rem;
  }
}

/* Mobile: inset legacy page content from iframe edges (shared injection — pages link archive-museum.css) */
@media (max-width: 768px) {
  html {
    box-sizing: border-box;
  }

  body {
    box-sizing: border-box;
    padding: 0.75rem 1rem 1rem;
  }
}