/* dctheory.org — academic / professional style */

:root {
  --bg: #ffffff;
  --bg-soft: #f6f5f1;
  --bg-card: #ffffff;
  --fg: #16181d;
  --fg-soft: #5a6271;
  --rule: #e3e1da;
  --rule-strong: #c9c5b8;
  --link: #1d4ed8;
  --link-hover: #1e3a8a;
  --accent: #b91c1c;
  --code-bg: #f3f4f6;
  --max-text: 760px;
  --max-wide: 1180px;
  --radius: 4px;
  --serif: "Iowan Old Style", "Charter", "Source Serif Pro", "Palatino Linotype", Georgia, serif;
  --sans:  -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono:  ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
}

/* === HEADER (single row, simple) === */
header.site {
  flex: 0 0 auto;
  border-bottom: 1px solid var(--rule);
  background: var(--bg);
  position: sticky; top: 0; z-index: 100;
}
header.site .inner {
  max-width: var(--max-wide);
  margin: 0 auto;
  padding: 14px 24px;
  display: flex;
  align-items: center;
  gap: 24px;
}
header.site .logo {
  font-family: var(--sans);
  font-weight: 600;
  font-size: 15px;
  color: var(--fg);
  text-decoration: none;
  letter-spacing: -0.005em;
  white-space: nowrap;
}
header.site nav {
  display: flex;
  align-items: center;
  gap: 4px 22px;
  margin-left: auto;
  flex-wrap: nowrap;
}
header.site nav a {
  font-family: var(--sans);
  color: var(--fg-soft);
  text-decoration: none;
  font-size: 14px;
  padding: 6px 0;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
  transition: color 0.12s, border-color 0.12s;
}
header.site nav a:hover { color: var(--link); }
header.site nav a.active {
  color: var(--fg);
  border-bottom-color: var(--link);
}
header.site .icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 1px solid var(--rule);
  color: var(--fg-soft);
  margin-left: 6px;
}
header.site .icon-link:hover {
  border-color: var(--link);
  color: var(--link);
}
header.site .burger {
  display: none;
  background: none;
  border: 0;
  padding: 6px;
  margin-left: auto;
  cursor: pointer;
  width: 36px;
  height: 36px;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
}
header.site .burger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--fg);
  border-radius: 2px;
  transition: transform 0.2s, opacity 0.2s;
}
.nav-open header.site .burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-open header.site .burger span:nth-child(2) { opacity: 0; }
.nav-open header.site .burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 880px) {
  header.site .inner { flex-wrap: wrap; gap: 12px; }
  header.site .burger { display: flex; }
  header.site nav {
    display: none;
    flex: 1 1 100%;
    flex-direction: column;
    gap: 0;
    margin: 0 -24px;
    border-top: 1px solid var(--rule);
    padding: 8px 24px 14px;
    align-items: stretch;
  }
  header.site nav a {
    padding: 12px 0;
    border-bottom: 1px solid var(--rule);
    font-size: 15px;
  }
  header.site nav a:last-of-type { border-bottom: none; }
  .nav-open header.site nav { display: flex; }
  header.site .icon-link {
    width: auto; height: auto;
    border: none; border-radius: 0;
    padding: 12px 0;
    border-bottom: 1px solid var(--rule);
    justify-content: flex-start;
  }
  header.site .icon-link::after { content: " Search"; margin-left: 6px; font-size: 15px; }
}
/* === END HEADER === */

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html, body { height: 100%; }
html, body { overflow-x: hidden; max-width: 100%; }
body {
  margin: 0;
  font-family: var(--serif);
  font-size: 17px;
  line-height: 1.6;
  color: var(--fg);
  background: var(--bg);
  display: flex; flex-direction: column; min-height: 100vh;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}

/* Prevent any single element from forcing horizontal page scroll */
img, svg, video, iframe, embed, object { max-width: 100%; height: auto; }
pre, code { overflow-wrap: break-word; word-break: break-word; }
.cite-block, .doi-link { overflow-wrap: anywhere; word-break: break-word; }
main { flex: 1 0 auto; padding: 36px 24px 64px; }
main.text { max-width: var(--max-text); margin: 0 auto; }
main.wide { max-width: var(--max-wide); margin: 0 auto; }
a { color: var(--link); text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
a:hover { color: var(--link-hover); }

h1 { font-family: var(--serif); font-size: 36px; line-height: 1.15; margin: 0 0 12px; letter-spacing: -0.01em; font-weight: 700; }
h2 { font-family: var(--serif); font-size: 24px; margin: 40px 0 14px; letter-spacing: -0.005em; font-weight: 700; border-bottom: 1px solid var(--rule); padding-bottom: 8px; }
h3 { font-family: var(--serif); font-size: 19px; margin: 28px 0 10px; font-weight: 700; }
h4 { font-family: var(--sans); font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--fg); margin: 0 0 10px; }
p, li, dd { font-size: 17px; line-height: 1.6; }
.subtitle { color: var(--fg-soft); font-size: 19px; line-height: 1.45; margin: 0 0 28px; font-style: italic; }

.eyebrow { font-family: var(--sans); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg-soft); margin: 0 0 8px; font-weight: 600; }

.btn { font-family: var(--sans); font-size: 14px; font-weight: 500; display: inline-block; padding: 10px 18px; background: var(--link); color: white !important; text-decoration: none !important; border-radius: var(--radius); margin: 4px 8px 4px 0; }
.btn:hover { background: var(--link-hover); }
.btn.secondary { background: var(--bg); color: var(--fg) !important; border: 1px solid var(--rule-strong); }
.btn.secondary:hover { border-color: var(--link); color: var(--link) !important; }

.meta { font-family: var(--sans); display: flex; flex-wrap: wrap; gap: 16px; font-size: 14px; color: var(--fg-soft); margin: 12px 0 24px; }

/* Optional scroll-wrap for very wide tables */
.table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 18px 0; }
.table-wrap table.data { margin: 0; }
table.data { width: 100%; border-collapse: collapse; margin: 18px 0; font-family: var(--sans); font-size: 14px; table-layout: auto; max-width: 100%; }
/* Allow nowrap cells to break on narrow viewports so they can't push the page wide */
@media (max-width: 720px) {
  table.data td.num, table.data td.code, table.data td.symbol { white-space: normal; word-break: break-word; }
  table.data th { white-space: normal; }
}
table.data th, table.data td { text-align: left; padding: 10px 14px; vertical-align: top; border-bottom: 1px solid var(--rule); }
table.data th { font-weight: 600; color: var(--fg); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; border-bottom: 2px solid var(--rule-strong); background: var(--bg-soft); }
table.data tbody tr:hover { background: var(--bg-soft); }
table.data td.num { font-family: var(--mono); font-size: 13px; text-align: right; white-space: nowrap; }
table.data td.symbol { font-family: var(--serif); font-style: italic; font-size: 17px; white-space: nowrap; text-align: center; min-width: 80px; }
table.data td.code { font-family: var(--mono); font-size: 13px; white-space: nowrap; }

.cluster-grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)); margin: 24px 0; }
.cluster-card { border: 1px solid var(--rule); border-radius: var(--radius); padding: 20px; background: var(--bg); display: flex; flex-direction: column; gap: 10px; }
.cluster-card:hover { border-color: var(--link); }
.cluster-card .code { font-family: var(--sans); font-size: 11px; color: var(--accent); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
.cluster-card h3 { margin: 0; font-size: 17px; line-height: 1.3; }
.cluster-card h3 a { color: var(--fg); text-decoration: none; }
.cluster-card h3 a:hover { color: var(--link); text-decoration: underline; }
.cluster-card .lede-mini { font-size: 14px; color: var(--fg-soft); line-height: 1.55; flex: 1; font-family: var(--sans); }
.cluster-card .doi { font-size: 12px; color: var(--fg-soft); font-family: var(--mono); }

.foundation-list { list-style: none; padding: 0; margin: 16px 0; display: grid; gap: 6px; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); }
.foundation-list li { border: 1px solid var(--rule); border-radius: var(--radius); padding: 10px 14px; font-family: var(--sans); font-size: 14px; }
.foundation-list li .num { font-family: var(--mono); color: var(--accent); margin-right: 10px; font-size: 11px; font-weight: 600; }
.foundation-list li a { text-decoration: none; color: var(--fg); }
.foundation-list li a:hover { color: var(--link); }

.foundation-group { margin: 24px 0 12px; }
.foundation-group h3 { margin: 0 0 10px; font-family: var(--sans); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg-soft); border-bottom: 1px solid var(--rule); padding-bottom: 6px; font-weight: 600; }
ul.foundation-list-grouped { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); }
ul.foundation-list-grouped li { border: 1px solid var(--rule); border-radius: var(--radius); padding: 10px 14px; font-family: var(--sans); font-size: 14px; background: var(--bg); }
ul.foundation-list-grouped li a:first-child { color: var(--fg); text-decoration: none; }
ul.foundation-list-grouped li a:first-child:hover { color: var(--link); }
.superseded { display: inline-block; font-size: 12px; color: var(--fg-soft); margin-left: 6px; }
.superseded a { color: var(--link); }

.banner-info, 

.figure-grid { display: grid; gap: 22px; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); margin: 24px 0; }
.figure-grid figure { margin: 0; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--bg); padding: 12px; }
.figure-grid figure img { width: 100%; height: auto; display: block; border-radius: 2px; background: white; }
.figure-grid figcaption { font-family: var(--sans); font-size: 13px; color: var(--fg-soft); margin-top: 8px; line-height: 1.5; }

dl.glossary { margin: 0; }
dl.glossary dt { font-family: var(--serif); font-weight: 700; margin-top: 18px; font-size: 17px; }
dl.glossary dd { margin: 4px 0 0; color: var(--fg-soft); font-size: 15px; line-height: 1.5; font-family: var(--sans); }

.test-card { border: 1px solid var(--rule); border-radius: var(--radius); padding: 20px 24px; margin: 18px 0; background: var(--bg); }
.test-card h3 { margin-top: 0; }
.test-card .when { font-family: var(--sans); font-size: 13px; color: var(--fg-soft); margin-top: -8px; }

.code-card { border: 1px solid var(--rule); border-radius: var(--radius); padding: 16px 20px; margin: 14px 0; background: var(--bg); }
.code-card h3 { margin: 0 0 6px; font-size: 17px; }
.code-card p { margin: 6px 0; font-family: var(--sans); font-size: 14px; }
.code-meta { font-family: var(--mono); font-size: 12.5px; color: var(--fg-soft); display: flex; gap: 16px; flex-wrap: wrap; align-items: center; margin-top: 10px; }
.code-meta .code-name code { font-size: 12px; }

.cite-block { background: var(--code-bg); padding: 14px 16px; border-radius: var(--radius); font-family: var(--mono); font-size: 13px; line-height: 1.5; overflow-x: auto; white-space: pre-wrap; word-break: break-word; }

.zenodo-details { border: 1px solid var(--rule); border-radius: var(--radius); padding: 18px 22px; background: var(--bg-soft); margin: 18px 0; }
.zenodo-details .details-h { font-family: var(--sans); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg-soft); margin: 0 0 14px; border-bottom: 1px solid var(--rule); padding-bottom: 8px; font-weight: 600; }
.zenodo-meta { display: grid; grid-template-columns: 170px 1fr; gap: 6px 18px; font-family: var(--sans); font-size: 14.5px; margin: 0; }
.zenodo-meta dt { color: var(--fg-soft); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; padding-top: 3px; font-weight: 600; }
.zenodo-meta dd { margin: 0 0 12px 0; }
@media (max-width: 720px) { .zenodo-meta { grid-template-columns: 1fr; gap: 4px; } .zenodo-meta dd { margin-bottom: 18px; } }

.doi-link { font-family: var(--mono); font-size: 13px; background: var(--bg); padding: 2px 8px; border-radius: 3px; border: 1px solid var(--rule); }
.license-badge img { vertical-align: middle; border: 0; }
.file-list { list-style: none; padding: 0; margin: 0; }
.file-list li { display: flex; justify-content: space-between; align-items: baseline; padding: 6px 0; border-bottom: 1px dashed var(--rule); font-family: var(--mono); font-size: 13px; }
.file-list li:last-child { border-bottom: none; }
.file-list .file-size { color: var(--fg-soft); font-size: 12px; }
.cite-tabs details { margin: 8px 0; border: 1px solid var(--rule); border-radius: var(--radius); padding: 8px 14px; background: var(--bg); }
.cite-tabs summary { cursor: pointer; padding: 4px 0; font-family: var(--sans); font-size: 14px; font-weight: 600; }
.cite-apa { font-size: 14.5px; line-height: 1.5; margin: 8px 0 4px; }
.related-list { list-style: none; padding: 0; margin: 12px 0; }
.related-list li { padding: 8px 0; border-bottom: 1px solid var(--rule); font-family: var(--sans); font-size: 14px; }
.related-list li:last-child { border-bottom: none; }
.related-list .rel-type { display: inline-block; font-size: 10px; padding: 2px 8px; background: var(--bg-soft); border-radius: 999px; color: var(--fg-soft); letter-spacing: 0.06em; text-transform: uppercase; margin-right: 8px; font-weight: 600; }

.pdf-viewer { width: 100%; height: 90vh; min-height: 800px; border: 1px solid var(--rule); border-radius: var(--radius); margin: 18px 0; background: var(--bg-soft); }
.pdf-viewer-fallback { font-family: var(--sans); font-size: 14px; color: var(--fg-soft); padding: 14px 18px; background: var(--bg-soft); border-radius: var(--radius); border: 1px dashed var(--rule); margin: 18px 0; }

hr { border: none; border-top: 1px solid var(--rule); margin: 32px 0; }
code { font-family: var(--mono); font-size: 0.92em; background: var(--code-bg); padding: 1px 5px; border-radius: 3px; }

footer.site { flex: 0 0 auto; border-top: 1px solid var(--rule); padding: 32px 24px 40px; background: var(--bg-soft); font-family: var(--sans); font-size: 14px; color: var(--fg-soft); }
footer.site .inner { max-width: var(--max-wide); margin: 0 auto; display: grid; gap: 32px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
footer.site h4 { font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--fg); margin: 0 0 10px; font-weight: 600; }
footer.site p { font-size: 13px; line-height: 1.5; margin: 0 0 8px; font-family: var(--sans); }
footer.site a { color: var(--link); }

.search-box { width: 100%; padding: 14px 18px; font-size: 18px; font-family: var(--sans); border: 1px solid var(--rule-strong); border-radius: var(--radius); background: var(--bg); color: var(--fg); margin: 18px 0; }
.search-box:focus { outline: none; border-color: var(--link); }
.search-results { list-style: none; padding: 0; margin: 0; }
.search-result { padding: 14px 0; border-bottom: 1px solid var(--rule); }
.search-result h3 { margin: 0 0 4px; font-size: 17px; }
.search-result h3 a { color: var(--link); text-decoration: none; }
.search-result h3 a:hover { text-decoration: underline; }
.search-result .url { font-size: 12px; color: var(--fg-soft); font-family: var(--mono); }
.search-result .snippet { margin-top: 6px; font-family: var(--sans); font-size: 14.5px; color: var(--fg-soft); line-height: 1.55; }
.search-result mark { background: #fff4e0; color: #5a3a00; padding: 0 2px; border-radius: 2px; }

@media (max-width: 640px) {
  body { font-size: 16px; }
  h1 { font-size: 28px; }
  h2 { font-size: 21px; }
  main { padding: 24px 18px 60px; }
  
}

/* === Per-paper page: wide PDF viewer + comfortable prose === */
main.paper {
  flex: 1 0 auto;
  max-width: 1400px;
  margin: 0 auto;
  padding: 28px 32px 64px;
}
main.paper > p,
main.paper > h1,
main.paper > h2,
main.paper > h3,
main.paper > .meta,
main.paper > ul,
main.paper > ol,
main.paper > pre,
main.paper > .lede,
main.paper > .companions,
main.paper > .tags,
main.paper > .cite-tabs,
main.paper > .related-list,
main.paper > .zenodo-details {
  max-width: 920px;
}
main.paper > .pdf-viewer,
main.paper > h2 + .pdf-viewer,
main.paper > .pdf-viewer-fallback {
  max-width: 100%;
}
main.paper > .pdf-viewer {
  width: 100%;
  height: calc(100vh - 140px);
  min-height: 720px;
  margin: 18px 0 28px;
}
@media (max-width: 720px) {
  main.paper { padding: 20px 16px 60px; }
  main.paper > .pdf-viewer { height: 75vh; min-height: 480px; }
}

/* === Restructured nav with Data dropdown === */

/* Truly hide the burger checkbox */

/* Data dropdown */

/* Mobile: dropdown becomes inline list */
@media (max-width: 880px) { /* mobile burger handled by .nav-open class */ }

/* === HEADER LIVE SEARCH === */
.search-wrap {
  position: relative;
  margin-left: 8px;
}
.search-input {
  width: 220px;
  padding: 7px 12px 7px 32px;
  border: 1px solid var(--rule);
  border-radius: 999px;
  font-family: var(--sans);
  font-size: 13.5px;
  color: var(--fg);
  background: var(--bg) url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%235a6271" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></svg>') no-repeat 10px center;
  transition: border-color 0.12s, width 0.18s;
}
.search-input:focus {
  border-color: var(--link);
  outline: none;
  width: 280px;
}
.search-input::placeholder { color: var(--fg-soft); }

.search-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  width: 380px;
  max-width: 90vw;
  max-height: 70vh;
  overflow-y: auto;
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 6px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.10);
  z-index: 200;
}
.search-dropdown[hidden] { display: none; }

.sr-item {
  display: block;
  padding: 12px 16px;
  border-bottom: 1px solid var(--rule);
  text-decoration: none;
  color: inherit;
}
.sr-item:last-child { border-bottom: none; }
.sr-item:hover { background: var(--bg-soft); }
.sr-title {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 14.5px;
  color: var(--fg);
  margin-bottom: 3px;
}
.sr-item:hover .sr-title { color: var(--link); }
.sr-snippet {
  font-family: var(--sans);
  font-size: 12.5px;
  color: var(--fg-soft);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sr-url {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--fg-soft);
  margin-top: 4px;
  opacity: 0.75;
}
.sr-item mark {
  background: #fff4e0;
  color: #5a3a00;
  padding: 0 2px;
  border-radius: 2px;
}
.sr-empty {
  padding: 18px;
  text-align: center;
  color: var(--fg-soft);
  font-family: var(--sans);
  font-size: 14px;
}

@media (max-width: 880px) {
  .search-wrap {
    width: 100%;
    margin: 0;
    padding: 12px 0;
    order: 99;
  }
  .search-input { width: 100%; }
  .search-input:focus { width: 100%; }
  .search-dropdown {
    position: static;
    width: 100%;
    margin-top: 8px;
    box-shadow: none;
  }
}

/* === NASA-style technical palette + editorial notes === */

/* Scorecard bar — desaturated technical colours */
.scorecard-bar {
  display: flex;
  height: 28px;
  margin: 16px 0 6px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.04em;
  border: 1px solid var(--rule-strong);
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
.scorecard-bar > div {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #f5f4ef;
  padding: 0 6px;
  border-right: 1px solid rgba(255,255,255,0.18);
}
.scorecard-bar > div:last-child { border-right: none; }
.scorecard-bar .b-hit  { background: #2c4a3e; }   /* deep forest */
.scorecard-bar .b-soft { background: #2a3f6b; }   /* NASA navy */
.scorecard-bar .b-flag { background: #6b5630; }   /* dark gold */
.scorecard-bar .b-miss { background: #6b2a2a; }   /* deep crimson */
.scorecard-bar .b-open { background: #443a5e; }   /* dark indigo */

.scorecard-legend {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 6px 18px;
  font-family: var(--mono);
  font-size: 11.5px;
  margin: 6px 0 24px;
  color: var(--fg-soft);
  letter-spacing: 0.02em;
}
.scorecard-legend span::before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 0;
  margin-right: 7px;
  vertical-align: 1px;
}
.scorecard-legend .lh::before { background: #2c4a3e; }
.scorecard-legend .ls::before { background: #2a3f6b; }
.scorecard-legend .lf::before { background: #6b5630; }
.scorecard-legend .lm::before { background: #6b2a2a; }
.scorecard-legend .lo::before { background: #443a5e; }

/* Verdict pills — square corners, monospace, low-saturation */
.verdict {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 2px;
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.06em;
  font-weight: 500;
  text-transform: uppercase;
  border: 1px solid;
}
.verdict.hit       { background: #f1f5f2; color: #2c4a3e; border-color: #c5d3ca; }
.verdict.soft      { background: #f0f2f8; color: #2a3f6b; border-color: #c5cfe0; }
.verdict.flag      { background: #f7f3e9; color: #6b5630; border-color: #d9cfb0; }
.verdict.miss      { background: #f7eded; color: #6b2a2a; border-color: #d9c0c0; }
.verdict.open      { background: #f1eef5; color: #443a5e; border-color: #cfc7d6; }
.verdict.live      { background: #f7f3e9; color: #6b5630; border-color: #d9cfb0; }
.verdict.resolved  { background: #f1f5f2; color: #2c4a3e; border-color: #c5d3ca; }
.verdict.retracted { background: #f7eded; color: #6b2a2a; border-color: #d9c0c0; }
.verdict.superseded{ background: #f1f1ef; color: #3a3a36; border-color: #c8c8c2; }
.verdict.post-hoc  { background: #f1eef5; color: #443a5e; border-color: #cfc7d6; }

/* Status pills (paper drafts) */
.status-pill {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 2px;
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1px solid;
}
.status-pill.draft     { background: #f7f3e9; color: #6b5630; border-color: #d9cfb0; }
.status-pill.published { background: #f1f5f2; color: #2c4a3e; border-color: #c5d3ca; }

/* Tags */
.tags { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0; }
.tag {
  font-family: var(--mono);
  font-size: 11px;
  padding: 2px 8px;
  background: transparent;
  border-radius: 2px;
  color: var(--fg-soft);
  border: 1px solid var(--rule-strong);
  letter-spacing: 0.02em;
}

/* Editorial-note style for callouts (NASA technical-document feel) */
.callout {
  border-left: 2px solid var(--rule-strong);
  padding: 0 0 0 16px;
  margin: 18px 0;
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.55;
  color: var(--fg-soft);
  background: none;
  border-top: none;
  border-right: none;
  border-bottom: none;
  border-radius: 0;
}
.callout::before {
  content: "Note. ";
  font-family: var(--sans);
  font-weight: 600;
  font-variant: small-caps;
  letter-spacing: 0.06em;
  color: var(--fg);
  margin-right: 4px;
}
.callout.warn {
  border-left-color: #6b5630;
  color: #5a4724;
}
.callout.warn::before { content: "Caution. "; color: #6b5630; }
.callout.danger {
  border-left-color: #6b2a2a;
  color: #5a2222;
}
.callout.danger::before { content: "Warning. "; color: #6b2a2a; }

/* Yellow warn-banners turn into editorial notes too */
.banner-warn {
  border: none;
  border-left: 2px solid #6b5630;
  background: none;
  padding: 0 0 0 16px;
  margin: 0 0 24px;
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.55;
  color: #5a4724;
  border-radius: 0;
}
.banner-warn::before {
  content: "Editorial note. ";
  font-weight: 600;
  font-variant: small-caps;
  letter-spacing: 0.06em;
  color: #6b5630;
}
.banner-info {
  border: none;
  border-left: 2px solid var(--link);
  background: none;
  padding: 0 0 0 16px;
  margin: 18px 0;
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.55;
  color: var(--fg-soft);
  border-radius: 0;
}

/* Lede — pull-quote style */
.lede {
  border-left: 3px solid var(--link);
  background: none;
  padding: 4px 0 4px 18px;
  margin: 22px 0;
  font-family: var(--serif);
  font-size: 17px;
  font-style: italic;
  line-height: 1.5;
  color: var(--fg);
  border-radius: 0;
}

/* Pass / fail markers in test cards — sober and small-caps */
.test-card .pass {
  color: #2c4a3e;
  font-weight: 600;
  font-variant: small-caps;
  letter-spacing: 0.06em;
}
.test-card .fail {
  color: #6b2a2a;
  font-weight: 600;
  font-variant: small-caps;
  letter-spacing: 0.06em;
}

/* Mark / highlight inside search results */
.sr-item mark {
  background: #fff3d6;
  color: #5a4724;
}

/* === END NASA-style === */

/* === NASA-style scientific chart container === */
.nasa-chart { background: #fff; border: 1px solid var(--rule); padding: 20px 24px; margin: 20px 0; font-family: var(--sans); }
.nasa-chart svg { display: block; width: 100%; height: auto; max-width: 100%; }
.nasa-chart .chart-title { font-size: 13px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--fg); margin: 0 0 4px; }
.nasa-chart .chart-subtitle { font-size: 12px; color: var(--fg-soft); margin: 0 0 14px; }
.nasa-chart .chart-source { font-size: 10px; color: var(--fg-soft); text-transform: uppercase; letter-spacing: 0.06em; margin: 10px 0 0; text-align: right; }
.nasa-chart .chart-caption { font-size: 13px; color: var(--fg-soft); margin: 12px 0 0; line-height: 1.55; }
.obs-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px 24px; padding: 16px 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); margin: 16px 0 24px; font-size: 13px; }
.obs-meta dt { font-weight: 600; font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fg-soft); margin: 0 0 4px; }
.obs-meta dd { margin: 0; font-family: var(--mono); font-size: 13px; }
.obs-downloads { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 8px; }
.obs-downloads a { display: inline-block; padding: 6px 12px; border: 1px solid var(--rule); background: var(--bg-soft); font-size: 12px; font-family: var(--sans); text-transform: uppercase; letter-spacing: 0.04em; color: var(--fg); border-radius: 3px; }
.obs-downloads a:hover { border-color: var(--accent); color: var(--accent); text-decoration: none; }


/* === Sober scientific replacements (override colored-pill / rainbow-bar style) === */
.verdict {
  display: inline-block;
  padding: 2px 8px;
  border: 1px solid var(--rule-strong);
  background: transparent;
  color: var(--fg);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border-radius: 0;
  white-space: nowrap;
}
.verdict.hit       { border-color: #2c4a3e; color: #2c4a3e; background: transparent; }
.verdict.soft      { border-color: #5a6271; color: #5a6271; background: transparent; }
.verdict.miss      { border-color: #6b2a2a; color: #6b2a2a; background: transparent; }
.verdict.open      { border-color: #5a6271; color: #5a6271; background: transparent; }
.verdict.flag      { border-color: #5a6271; color: #5a6271; background: transparent; }
.verdict.resolved  { border-color: #2c4a3e; color: #2c4a3e; background: transparent; }
.verdict.retracted { border-color: #6b2a2a; color: #6b2a2a; background: transparent; }
.verdict.superseded{ border-color: #888; color: #888; background: transparent; }
.verdict.live      { border-color: #5a6271; color: #5a6271; background: transparent; }
.verdict.post-hoc  { border-color: #5a6271; color: #5a6271; background: transparent; }

/* Replace rainbow bar with thin scientific bar */
.scorecard-bar {
  height: 24px;
  border: 1px solid var(--rule-strong);
  background: #fff;
  margin: 18px 0 6px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.04em;
}
.scorecard-bar > div {
  background: transparent !important;
  color: var(--fg);
  border-right: 1px solid var(--rule);
  text-align: left;
  padding: 4px 8px;
  height: 100%;
  box-sizing: border-box;
}
.scorecard-bar .b-hit  { background: #2c4a3e !important; color: #fff; }
.scorecard-bar .b-soft { background: #c8cdd6 !important; color: #1a1a1a; }
.scorecard-bar .b-flag { background: #b8b3a0 !important; color: #1a1a1a; }
.scorecard-bar .b-miss { background: #6b2a2a !important; color: #fff; }
.scorecard-bar .b-open { background: #e3e1da !important; color: #1a1a1a; }

.scorecard-legend {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  color: var(--fg-soft);
  margin-top: 10px;
}
.scorecard-legend span::before {
  width: 9px; height: 9px;
  border-radius: 0;
  margin-right: 5px;
  margin-bottom: -1px;
  border: 1px solid var(--rule-strong);
  display: inline-block;
}
.scorecard-legend .lh::before { background: #2c4a3e; border-color: #2c4a3e; }
.scorecard-legend .ls::before { background: #c8cdd6; border-color: #c8cdd6; }
.scorecard-legend .lf::before { background: #b8b3a0; border-color: #b8b3a0; }
.scorecard-legend .lm::before { background: #6b2a2a; border-color: #6b2a2a; }
.scorecard-legend .lo::before { background: #e3e1da; border-color: #c9c5b8; }


/* === Header redesign: two-line logo, no burger, search icon link === */
header.site .logo {
  display: inline-flex;
  flex-direction: column;
  line-height: 1.2;
  text-decoration: none;
  margin: 0;
  padding: 0;
}
header.site .logo .logo-title {
  font-family: var(--sans);
  font-weight: 600;
  font-size: 15px;
  letter-spacing: -0.01em;
  color: var(--fg);
}
header.site .logo .logo-host {
  font-family: var(--mono);
  font-weight: 400;
  font-size: 11px;
  letter-spacing: 0.02em;
  color: var(--fg-soft);
  text-transform: lowercase;
  margin-top: 1px;
}
header.site .burger { display: none !important; }
header.site nav { display: flex; flex-wrap: wrap; align-items: center; gap: 0; }
header.site nav a { padding: 8px 14px; font-size: 13px; }
header.site nav a.search-icon {
  font-size: 16px; color: var(--fg-soft); padding: 6px 8px; border-left: 1px solid var(--rule); margin-left: 6px;
}
header.site nav a.search-icon:hover { color: var(--accent); border-color: var(--accent); }
@media (max-width: 880px) {
  /* legacy column-stack disabled — see MOBILE HEADER FIX block below */
  header.site nav { width: 100%; flex-wrap: wrap; gap: 0 4px; }
  header.site nav a { padding: 6px 10px; font-size: 12px; }
}


/* === Header search box === */
.search-box {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin-left: 10px;
  border-left: 1px solid var(--rule);
  padding-left: 10px;
}
.search-box input[type="search"] {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: 12.5px;
  color: var(--fg);
  background: var(--bg-soft);
  border: 1px solid var(--rule);
  border-radius: 2px;
  padding: 5px 10px 5px 26px;
  width: 200px;
  outline: none;
  transition: border-color 0.15s, background 0.15s, width 0.15s;
}
.search-box input[type="search"]:focus {
  border-color: var(--accent);
  background: #fff;
  width: 260px;
}
.search-box input[type="search"]::-webkit-search-decoration,
.search-box input[type="search"]::-webkit-search-cancel-button { display: none; }
.search-box .search-glyph {
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 13px;
  color: var(--fg-soft);
  pointer-events: none;
}
.search-box .search-results {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  width: 420px;
  max-height: 480px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid var(--rule-strong);
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  z-index: 100;
}
.search-box .search-results[hidden] { display: none; }
.search-box .sr-item {
  display: block;
  padding: 10px 14px;
  border-bottom: 1px solid var(--rule);
  text-decoration: none;
  color: var(--fg);
}
.search-box .sr-item:last-child { border-bottom: none; }
.search-box .sr-item:hover { background: var(--bg-soft); }
.search-box .sr-empty { padding: 14px; font-size: 12.5px; color: var(--fg-soft); text-align: center; }
.search-box mark { background: #fff3a3; padding: 0 2px; }

/* Search dropdown: section-level results */
.sr-context { font-size: 11px; color: var(--fg-soft); font-family: var(--mono); margin-top: 2px; }
.sr-item .sr-title { font-weight: 600; font-size: 14px; color: var(--fg); }
.sr-item .sr-snippet { font-size: 12px; color: var(--fg-soft); margin-top: 4px; line-height: 1.4; }
.sr-item .sr-url { font-size: 11px; color: var(--fg-soft); font-family: var(--mono); margin-top: 4px; }

@media (max-width: 880px) {
  .search-box { margin-left: 0; padding-left: 0; border-left: none; width: 100%; margin-top: 6px; }
  .search-box input[type="search"] { width: 100%; }
  .search-box input[type="search"]:focus { width: 100%; }
  .search-box .search-results { width: 100%; right: 0; left: 0; }
}


/* Page-level table-of-contents: rendered as boxed buttons matching .obs-downloads.
   Hardened with !important + nav.page-toc to defeat any specificity collision. */
nav.page-toc, .page-toc { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; margin: 18px 0 24px !important; padding: 0 !important; border: 0 !important; background: none !important; }
nav.page-toc a, .page-toc a { display: inline-block !important; padding: 6px 12px !important; border: 1px solid var(--rule) !important; background: var(--bg-soft) !important; font-size: 12px !important; font-family: var(--sans) !important; font-weight: 500 !important; text-transform: uppercase !important; letter-spacing: 0.04em !important; color: var(--fg) !important; border-radius: 3px !important; text-decoration: none !important; line-height: 1.3 !important; white-space: nowrap !important; }
nav.page-toc a:hover, .page-toc a:hover { border-color: var(--accent) !important; color: var(--accent) !important; text-decoration: none !important; background: #fff !important; }


/* === Paper cards on /papers/ === */
.paper-cards { display: grid; gap: 16px; margin: 18px 0 32px; }
.paper-card { border: 1px solid var(--rule); padding: 20px 24px; background: #fff; }
.paper-card .paper-head { display: flex; gap: 10px; align-items: center; margin: 0 0 6px; }
.paper-card .paper-code { font-family: var(--mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fg-soft); border: 1px solid var(--rule); padding: 2px 7px; background: var(--bg-soft); }
.paper-card .paper-status { font-family: var(--mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; padding: 2px 7px; border: 1px solid var(--rule); }
.paper-card .paper-status.draft { color: #5a6271; border-color: #c8cdd6; background: #f0f2f8; }
.paper-card .paper-status.ready { color: #4a3e22; border-color: #d4cba0; background: #faf6e8; }
.paper-card .paper-status.published { color: #2c4a3e; border-color: #c5d3ca; background: #f1f5f2; }
.paper-card h3 { margin: 0 0 8px; font-size: 18px; font-weight: 600; }
.paper-card h3 a { color: var(--fg); text-decoration: none; }
.paper-card h3 a:hover { color: var(--accent); }
.paper-card .paper-abstract { font-size: 14px; color: var(--fg); line-height: 1.55; margin: 0 0 14px; }
.paper-card .paper-meta { display: grid; grid-template-columns: max-content 1fr; gap: 4px 16px; font-size: 12px; margin: 0 0 14px; }
.paper-card .paper-meta dt { font-family: var(--mono); color: var(--fg-soft); text-transform: uppercase; letter-spacing: 0.04em; font-size: 10px; padding-top: 2px; }
.paper-card .paper-meta dd { margin: 0; font-family: var(--mono); font-size: 12px; }


/* === Chart polish: journal-style framing === */
.nasa-chart {
  background: #fff;
  border: 1px solid var(--rule-strong);
  padding: 24px 28px;
  margin: 28px 0;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}
.nasa-chart .chart-title {
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: -0.005em;
  text-transform: none;
  color: #16181d;
  margin: 0 0 4px;
}
.nasa-chart .chart-subtitle {
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: #5a6271;
  margin: 0 0 18px;
  line-height: 1.45;
}
.nasa-chart .chart-source {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 10px;
  text-transform: none;
  letter-spacing: 0;
  color: #5a6271;
  margin: 14px 0 0;
  text-align: left;
  border-top: 1px solid var(--rule);
  padding-top: 8px;
}
.nasa-chart .chart-caption {
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 12px;
  color: #5a6271;
  margin: 12px 0 0;
  line-height: 1.5;
}

/* === MOBILE-FIRST OVERRIDES (audit 2026-05-06) ============================
   Goal: 100% usable on phones for scientific readers — no horizontal scroll
   from MathJax / tables / wide grids; legible nav with proper tap targets;
   readable PDF fallbacks; sensible footer / data grids on narrow widths.
   Loaded last so these win over earlier rules. ============================ */

/* MathJax: long display equations are the most common source of horizontal
   scroll on phones. CHTML wraps content in <mjx-container>. Allow it to
   scroll inside its own box, never push the page wide. */
mjx-container {
  max-width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
}
mjx-container[display="true"] {
  display: block;
  margin: 1em 0;
  padding-bottom: 4px;
}

/* Belt-and-braces: never let a child push main wider than the viewport. */
main, main.text, main.wide, main.paper { min-width: 0; }
main img, main svg, main video, main iframe, main object, main embed {
  max-width: 100%;
}
.table-wrap { -webkit-overflow-scrolling: touch; }

/* Header / nav at <= 880px: legible, tappable, properly wrapped. */
@media (max-width: 880px) {
  header.site .inner {
    padding: 12px 16px;
    gap: 8px;
    /* align-items overridden by MOBILE HEADER FIX */
  }
  header.site .logo .logo-title { font-size: 14.5px; }
  header.site .logo .logo-host { font-size: 10.5px; }
  header.site nav {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 2px 4px;
    margin: 0;
    border-top: 1px solid var(--rule);
    padding-top: 8px;
  }
  header.site nav a {
    padding: 8px 10px;
    font-size: 13px;
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    border-bottom: 0;
  }
  header.site nav a.active {
    border-bottom: 0;
    background: var(--bg-soft);
    border-radius: 3px;
  }
  header.site nav a.search-icon {
    border-left: 0;
    margin-left: auto;
    font-size: 18px;
    padding: 6px 10px;
  }
}

/* Phones (< 600px). */
@media (max-width: 600px) {
  header.site { position: static; }
  header.site .inner { padding: 10px 14px; gap: 6px; }
  header.site .logo .logo-title { font-size: 14px; }
  header.site nav { padding-top: 6px; }
  header.site nav a { padding: 7px 8px; font-size: 12.5px; min-height: 34px; }

  main { padding: 20px 14px 48px; }
  main.paper { padding: 16px 12px 48px; }
  body { font-size: 16px; }
  h1 { font-size: 26px; }
  h2 { font-size: 20px; margin-top: 32px; }
  h3 { font-size: 17px; }
  .subtitle { font-size: 17px; }

  .btn { padding: 11px 16px; font-size: 14px; }

  /* Single column for any auto-fit grid — they all use minmax(>=240px,1fr)
     which can overflow on phones < 360px. */
  .cluster-grid,
  .figure-grid,
  ul.foundation-list-grouped,
  .foundation-list,
  .paper-cards { grid-template-columns: 1fr; gap: 12px; }
  .cluster-card { padding: 16px; }
  .paper-card { padding: 16px 18px; }

  footer.site .inner { grid-template-columns: 1fr; gap: 22px; }
  footer.site { padding: 24px 16px 32px; }

  dl.index-grid {
    grid-template-columns: 1fr !important;
    column-gap: 0 !important;
    row-gap: 12px !important;
  }

  /* Page TOC: wrap rather than nowrap-overflow. */
  nav.page-toc, .page-toc { gap: 6px !important; }
  nav.page-toc a, .page-toc a {
    white-space: normal !important;
    line-height: 1.25 !important;
    font-size: 11.5px !important;
    padding: 6px 9px !important;
  }

  /* Tables: tighter, break long tokens. */
  table.data { font-size: 13px; }
  table.data th, table.data td { padding: 8px 9px; }
  table.data td.num,
  table.data td.code,
  table.data td.symbol,
  table.data th { white-space: normal; word-break: break-word; }

  .scorecard-bar { height: 22px; font-size: 10.5px; }
  .scorecard-bar > div { padding: 4px 4px; }
  .verdict { white-space: normal; }

  .obs-meta { grid-template-columns: 1fr; gap: 10px 0; padding: 12px 0; }
  .zenodo-details { padding: 14px 16px; }

  /* PDF viewer: shrink but keep usable. */
  .pdf-viewer { height: 60vh; min-height: 360px; }
  main.paper > .pdf-viewer { height: 60vh; min-height: 360px; }
  .pdf-viewer-fallback { padding: 16px; font-size: 14px; }

  .nasa-chart { padding: 14px 14px; }

  .doi-link, code, .cite-block {
    word-break: break-word;
    overflow-wrap: anywhere;
  }
}

/* Very narrow (< 380px). */
@media (max-width: 380px) {
  header.site .logo .logo-title { font-size: 13px; }
  header.site .logo .logo-host { font-size: 10px; }
  header.site nav a { padding: 6px 7px; font-size: 12px; }
  h1 { font-size: 23px; }
  .lede { font-size: 15px; padding-left: 12px; }
}

/* Hard guards — last line of defence against horizontal scroll. */
img, table, pre, code, .pdf-viewer { max-width: 100%; }
/* === END MOBILE-FIRST OVERRIDES ========================================== */

/* === MOBILE HAMBURGER (audit 2026-05-06) ================================
   Real burger menu, injected by /static/search.js so we don't have to
   touch 287 HTML files. Desktop unchanged; <=880px gets a button +
   collapse-to-dropdown nav. ============================================ */

/* Desktop: burger hidden. Override the earlier `display:none !important`
   that sat in the file above. */
header.site .burger {
  display: none;
}

@media (max-width: 880px) {
  /* Burger: visible, sized for a thumb. */
  header.site .burger {
    display: inline-flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 42px;
    height: 42px;
    padding: 0;
    margin-left: auto;
    background: var(--bg);
    border: 1px solid var(--rule);
    border-radius: 4px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  header.site .burger:focus-visible {
    outline: 2px solid var(--link);
    outline-offset: 2px;
  }
  header.site .burger span {
    display: block;
    width: 20px;
    height: 2px;
    background: var(--fg);
    border-radius: 2px;
    transition: transform 0.18s ease, opacity 0.18s ease;
    transform-origin: center;
  }
  body.nav-open header.site .burger span:nth-child(1) {
    transform: translate(0, 6px) rotate(45deg);
  }
  body.nav-open header.site .burger span:nth-child(2) { opacity: 0; }
  body.nav-open header.site .burger span:nth-child(3) {
    transform: translate(0, -6px) rotate(-45deg);
  }

  /* Header layout: keep burger on the right of logo when collapsed. */
  header.site .inner {
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
  }

  /* Nav: hidden by default, full-width vertical dropdown when open. */
  header.site nav {
    display: none !important;
    flex: 1 1 100%;
    width: 100%;
    flex-direction: column;
    gap: 0;
    margin: 8px -16px 0;
    padding: 4px 16px 12px;
    border-top: 1px solid var(--rule);
    background: var(--bg);
  }
  body.nav-open header.site nav { display: flex !important; }
  header.site nav a,
  header.site nav a.search-icon {
    width: 100%;
    padding: 14px 6px;
    margin: 0;
    border: 0;
    border-bottom: 1px solid var(--rule);
    border-radius: 0;
    font-size: 15px;
    line-height: 1.3;
    min-height: 48px;
    color: var(--fg);
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }
  header.site nav a:last-child,
  header.site nav a.search-icon:last-child { border-bottom: 0; }
  header.site nav a.active {
    background: var(--bg-soft);
    border-radius: 3px;
    color: var(--fg);
    font-weight: 600;
  }
  header.site nav a.search-icon { font-size: 15px; }
  header.site nav a.search-icon::after {
    content: " Search";
    margin-left: 6px;
    font-family: var(--sans);
  }

  /* Sticky header would clip the open menu; keep static on phones so the
     dropdown can extend past the viewport without trapping content. */
  header.site { position: static; }
}

/* Lock body scroll while menu is open on phones (avoids two scroll
   contexts and the menu-jump effect). */
@media (max-width: 880px) {
  body.nav-open { overflow: hidden; }
}
/* === END MOBILE HAMBURGER =============================================== */

/* === MOBILE HEADER REFINE (audit 2026-05-06d) ============================
   Burger = ghost icon on the left.
   Search = ghost icon on the right.
   Logo vertically centered between them. ============================== */

/* Desktop: hide the mobile-only search shortcut. */
.mobile-search-shortcut { display: none; }

@media (max-width: 880px) {
  /* Inner row: align everything vertically; let nav wrap below. */
  header.site .inner {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center !important;
    gap: 4px 8px;
    padding: 10px 12px;
  }

  /* Logo: take the middle space, centered vertically with the icons. */
  header.site .logo {
    order: 1;
    flex: 1 1 auto;
    min-width: 0;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    line-height: 1.15;
    margin: 0;
  }
  header.site .logo .logo-title { font-size: 14.5px; line-height: 1.2; }
  header.site .logo .logo-host  { font-size: 10.5px; margin-top: 1px; }

  /* Burger: ghost icon on the LEFT, no border, no background. */
  header.site .burger {
    order: 0;
    display: inline-flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 32px;
    height: 32px;
    padding: 0;
    margin: 0 6px 0 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  header.site .burger:focus-visible {
    outline: 2px solid var(--link);
    outline-offset: 2px;
    border-radius: 4px;
  }
  header.site .burger span {
    width: 22px;
    height: 2px;
    background: var(--fg);
    border-radius: 2px;
    transition: transform 0.18s ease, opacity 0.18s ease;
  }

  /* Search shortcut: ghost icon on the RIGHT. */
  .mobile-search-shortcut {
    order: 2;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin-left: auto;
    color: var(--fg);
    background: transparent;
    border: 0;
    text-decoration: none;
    font-size: 20px;
    line-height: 1;
    flex: 0 0 auto;
  }
  .mobile-search-shortcut:hover { color: var(--link); }

  /* In-nav search-icon link: hide on mobile (replaced by the right-side
     shortcut). It still appears in desktop nav as before. */
  header.site nav a.search-icon { display: none !important; }

  /* Nav dropdown takes its own row beneath the header bar. */
  header.site nav {
    order: 3;
    flex: 1 1 100%;
    width: 100%;
    margin: 8px -12px 0;
    padding: 4px 12px 12px;
  }
}

/* Very narrow phones — keep proportions sane. */
@media (max-width: 380px) {
  header.site .burger { width: 30px; height: 30px; margin-right: 4px !important; }
  header.site .burger span { width: 20px; }
  .mobile-search-shortcut { width: 30px; height: 30px; font-size: 18px; }
  header.site .logo .logo-title { font-size: 13.5px; }
}
/* === END MOBILE HEADER REFINE ============================================ */

/* === MOBILE HEADER FIX (audit 2026-05-06e) =============================
   An older rule at line ~780 sets `flex-direction: column` on the header
   inner. Since my mobile refine block doesn't reset flex-direction, items
   were stacking vertically and centering on the cross-axis — that's why
   the burger was centered above the logo. Force row + wrap explicitly.
   ===================================================================== */
@media (max-width: 880px) {
  header.site .inner {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
  }
  /* Logo: allow content to shrink (remove the inherited nowrap that
     prevented it from shrinking past intrinsic width). */
  header.site .logo,
  header.site .logo .logo-title,
  header.site .logo .logo-host {
    white-space: normal;
  }
  header.site .logo .logo-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;            /* keep title on one line */
    max-width: 100%;
  }
  /* Belt-and-braces visibility on the right-side search shortcut. */
  .mobile-search-shortcut { display: inline-flex !important; }
}

/* === MOBILE FINAL OVERRIDES (audit 2026-05-06f) =========================
   Last in the file. Uses !important throughout to defeat ALL earlier
   conflicting mobile rules without ripping them out. ==================== */

/* Hard horizontal-scroll guard. */
html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

@media (max-width: 880px) {
  /* Header bar — burger LEFT, logo MIDDLE, search RIGHT, all on one row. */
  header.site .inner {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    padding: 10px 12px !important;
    gap: 4px 8px !important;
    max-width: 100% !important;
  }

  /* Burger: ghost icon, 0 order = first child visually. */
  header.site .burger {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: 32px !important;
    height: 32px !important;
    margin: 0 6px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    order: 0 !important;
    flex: 0 0 auto !important;
  }
  header.site .burger span {
    width: 22px !important;
    height: 2px !important;
    background: var(--fg) !important;
    border-radius: 2px !important;
  }

  /* Logo: shrinkable, vertically centered. */
  header.site .logo {
    order: 1 !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: inline-flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: normal !important;
  }
  header.site .logo .logo-title {
    font-size: 14.5px !important;
    line-height: 1.2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    max-width: 100% !important;
    display: block !important;
  }
  header.site .logo .logo-host {
    font-size: 10.5px !important;
    line-height: 1.2 !important;
    margin-top: 1px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 100% !important;
    display: block !important;
  }

  /* Right-side search shortcut, injected by search.js. */
  .mobile-search-shortcut {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    margin-left: auto !important;
    color: var(--fg) !important;
    background: transparent !important;
    border: 0 !important;
    text-decoration: none !important;
    font-size: 20px !important;
    line-height: 1 !important;
    flex: 0 0 auto !important;
    order: 2 !important;
  }
  .mobile-search-shortcut:hover { color: var(--link) !important; }

  /* Hide the in-nav search icon on mobile (replaced by shortcut). */
  header.site nav a.search-icon { display: none !important; }

  /* Nav: hidden by default, becomes a full-width vertical dropdown. */
  header.site nav {
    order: 3 !important;
    display: none !important;
    flex: 1 1 100% !important;
    width: 100% !important;
    flex-direction: column !important;
    margin: 8px -12px 0 !important;
    padding: 4px 12px 12px !important;
    border-top: 1px solid var(--rule) !important;
    background: var(--bg) !important;
    gap: 0 !important;
  }
  body.nav-open header.site nav { display: flex !important; }
  header.site nav a {
    display: flex !important;
    width: 100% !important;
    padding: 14px 6px !important;
    margin: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--rule) !important;
    border-radius: 0 !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
    min-height: 48px !important;
    color: var(--fg) !important;
    background: transparent !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  header.site nav a:last-child { border-bottom: 0 !important; }
  header.site nav a.active {
    background: var(--bg-soft) !important;
    border-radius: 3px !important;
    font-weight: 600 !important;
  }

  /* Header drops sticky on phones so the dropdown isn't clipped. */
  header.site { position: static !important; }
  body.nav-open { overflow: hidden !important; }

  /* Page TOC: chips MUST wrap. Prior `white-space: nowrap !important`
     was at line 865 — override here. */
  nav.page-toc a, .page-toc a {
    white-space: normal !important;
    line-height: 1.25 !important;
    font-size: 11.5px !important;
    padding: 6px 9px !important;
    word-break: break-word !important;
  }

  /* Tables: force wrap inside cells, even nowrap-tagged ones. */
  table.data { font-size: 13px !important; }
  table.data th, table.data td { padding: 8px 9px !important; }
  table.data td.num,
  table.data td.code,
  table.data td.symbol,
  table.data th { white-space: normal !important; word-break: break-word !important; }

  /* Verdict pills wrap. */
  .verdict { white-space: normal !important; }

  /* Long DOIs / URLs / cite blocks must break. */
  code, .cite-block, .doi-link { word-break: break-word !important; overflow-wrap: anywhere !important; }

  /* Headings on phones must shrink and wrap. */
  h1 { font-size: 26px !important; line-height: 1.2 !important; word-wrap: break-word !important; overflow-wrap: anywhere !important; }
  h2 { font-size: 20px !important; line-height: 1.25 !important; word-wrap: break-word !important; overflow-wrap: anywhere !important; }

  /* All grids collapse to single column at < 600px (re-stated for safety). */
}

@media (max-width: 600px) {
  .cluster-grid,
  .figure-grid,
  ul.foundation-list-grouped,
  .foundation-list,
  .paper-cards,
  footer.site .inner,
  dl.index-grid,
  .obs-meta {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  main { padding: 18px 12px 40px !important; max-width: 100% !important; }
  main.paper { padding: 14px 10px 40px !important; }
}
/* === END MOBILE FINAL OVERRIDES ========================================== */

/* === MOBILE SITEWIDE OVERFLOW GUARD (audit 2026-05-06g) ==================
   Last word on horizontal-scroll: nothing escapes the viewport.
   ===================================================================== */

@media (max-width: 880px) {
  /* Hard cap on every direct descendant of body, then on every direct
     descendant of main, so a stray child can't push width. */
  body > *,
  main > *,
  main.text > *,
  main.wide > *,
  main.paper > * {
    max-width: 100% !important;
  }
  /* Defensive: any element with explicit width that ignores parent. */
  [style*="width:"] {
    max-width: 100% !important;
  }
}

@media (max-width: 600px) {
  /* Scroll-indicator on .table-wrap so users see they can swipe. */
  .table-wrap {
    position: relative;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    margin-left: -2px;
    margin-right: -2px;
  }
  /* gradient fade removed at user request */
  .table-wrap::after { content: none !important; background: none !important; }
  /* Aggressive table compaction on phones. */
  .table-wrap table.data {
    font-size: 12.5px !important;
    min-width: 0 !important;
  }
  .table-wrap table.data th,
  .table-wrap table.data td {
    padding: 6px 7px !important;
    line-height: 1.4 !important;
  }
  .table-wrap table.data td.symbol { min-width: 0 !important; }

  /* MathJax: also allow horizontal scroll inside its own container. */
  mjx-container {
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 4px;
  }

  /* `pre` / `code` blocks: force wrap. */
  pre, pre code {
    white-space: pre-wrap !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  /* Long h2/h3 tokens */
  h1, h2, h3 {
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
    hyphens: auto;
  }

  /* iframes / objects (PDF viewer etc.): always cap. */
  iframe, object, embed, video {
    max-width: 100% !important;
  }

  /* Nuclear option: anything with a `style="width: ..px"` attribute. */
  *[style*="width:"][style*="px"] {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Always-on: never let a descendant push html/body. */
html { max-width: 100%; overflow-x: hidden; }
body { max-width: 100vw; overflow-x: hidden; }
/* === END SITEWIDE OVERFLOW GUARD ========================================= */

/* deploy bust 20260506T184439Z */
/* bust 20260506T184638Z */

/* === MOBILE TABLE FIX (audit 2026-05-06h) ==============================
   Earlier `word-break: break-word !important` on table cells was splitting
   numbers character-by-character ("1836.15267" rendering as "1836 / .1 /
   52 / 67"; "MEASURED" wrapping vertically). Reverse that: keep horizontal
   scroll inside .table-wrap and let cells stay ONE LINE per value.
   Also fix display equations that push past the viewport.
   ==================================================================== */

@media (max-width: 880px) {
  /* Tables: do NOT break inside cells. Restore numeric-cell legibility.
     The .table-wrap parent already provides horizontal scroll. */
  table.data,
  .table-wrap table.data {
    table-layout: auto !important;
  }
  table.data th,
  table.data td,
  .table-wrap table.data th,
  .table-wrap table.data td {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: manual !important;
  }
  /* Numeric and code cells stay on a single line. */
  table.data td.num,
  table.data td.code,
  table.data td.symbol,
  table.data th {
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }
  /* Note / long-text cells: allow normal word wrapping, NOT char-breaking. */
  table.data td:not(.num):not(.code):not(.symbol) {
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: auto;
  }
  /* Verdict pills must stay on one line. */
  .verdict {
    white-space: nowrap !important;
    word-break: keep-all !important;
  }

  /* The .table-wrap is the scroll container — make sure it actually scrolls
     and the table can grow naturally inside it. */
  .table-wrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }
  .table-wrap table.data {
    width: max-content !important;       /* let the table size to its content */
    min-width: 100% !important;
    max-width: none !important;
  }

  /* Display equations: scroll horizontally inside mjx-container. */
  mjx-container[display="true"] {
    display: block !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 4px;
  }
  /* Inline mjx-container should never break; scroll if needed. */
  mjx-container:not([display="true"]) {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    vertical-align: middle;
  }

  /* Headings: allow normal word wrapping, not char-by-char. */
  h1, h2, h3 {
    word-break: normal !important;
    overflow-wrap: break-word !important;
    hyphens: manual !important;
  }

  /* Long URLs / DOIs in body text — these CAN break since there are no spaces. */
  .doi-link,
  a[href^="https://doi.org"],
  .cite-block,
  pre code {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }
}
/* === END MOBILE TABLE FIX ============================================== */
/* table-wrap gradient removed 20260506T185919Z */
/* gradient cache-bust 20260506T191500.076530202Z */
