/*
  iSRL — res-log.css
  Self-sufficient stylesheet for research log pages.
  Wraps actual LaTeXML 0.8.8 HTML output in a three-column reading layout.
  No external CSS dependencies. No base.css required.

  Structure injected by isrl-publish.py:
    .isrl-mobile-header     (mobile only)
    .isrl-mobile-drawer     (mobile nav overlay)
    .isrl-shell
      .isrl-sidebar         (sticky left: logo + collapsed nav + ToC)
      .ltx_page_main        (LaTeXML's own wrapper — untouched class name)
        .ltx_page_content
          article.ltx_document ...
      .isrl-right           (right: document metadata panel)
*/

/* ─────────────────────────────────────────────────────────────
   FONTS
───────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;1,8..60,400&family=DM+Mono:wght@400;500&display=swap');

/* ─────────────────────────────────────────────────────────────
   RESET
───────────────────────────────────────────────────────────── */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* ─────────────────────────────────────────────────────────────
   CUSTOM PROPERTIES
───────────────────────────────────────────────────────────── */
:root {
  /* Palette — matches index.html and join.html exactly */
  --bg:           #f7f6f2;
  --ink:          #111110;
  --ink-mid:      #3a3a38;
  --ink-muted:    #5a5a57;    /* slightly raised from 6b — legible on --bg */
  --navy:         #2c346b;
  --red:          #c0392b;
  --rule:         #d0cfc8;
  --rule-light:   #e4e3dd;

  /* Typography */
  --font-title:   'Libre Baskerville', Georgia, serif;   /* titles only */
  --font-body:    'Source Serif 4', Georgia, serif;
  --font-mono:    'DM Mono', 'Courier New', monospace;

  /* Layout */
  --sidebar-w:    260px;
  --right-w:      210px;
  --content-max:  680px;
}

/* ─────────────────────────────────────────────────────────────
   BASE
───────────────────────────────────────────────────────────── */
html { font-size: 16px; }

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 1.1rem;
  line-height: 1.72;
  min-height: 100vh;
}

/* ─────────────────────────────────────────────────────────────
   SKIP LINK
───────────────────────────────────────────────────────────── */
.isrl-skip-link {
  position: absolute;
  top: -100%;
  left: 1rem;
  background: var(--navy);
  color: #fff;
  padding: 0.5rem 1rem;
  font-family: var(--font-mono);
  font-size: 0.9rem;
  z-index: 1000;
  text-decoration: none;
  border-radius: 0 0 3px 3px;
}
.isrl-skip-link:focus { top: 0; }


/* ═════════════════════════════════════════════════════════════
   THREE-COLUMN SHELL
   ════════════════════════════════════════════════════════════ */
.isrl-shell {
  display: grid;
  grid-template-columns: var(--sidebar-w) 1fr var(--right-w);
  min-height: 100vh;
  align-items: start;
}


/* ═════════════════════════════════════════════════════════════
   LEFT SIDEBAR
   ════════════════════════════════════════════════════════════ */
.isrl-sidebar {
  grid-column: 1;
  border-right: 1px solid var(--rule);
  padding: 2rem 1.5rem 2rem 1.75rem;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  scrollbar-width: thin;
  scrollbar-color: var(--rule) transparent;
}

/* — Logo — */
.isrl-logo-block { margin-bottom: 1.75rem; }

.isrl-logo-rule {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--ink);
  margin-bottom: 0.65rem;
}
.isrl-logo-wordmark {
  font-family: var(--font-title);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--ink);
  text-decoration: none;
  display: block;
  line-height: 1;
  letter-spacing: -0.01em;
}
.isrl-logo-wordmark .logo-i { font-style: italic; }

.isrl-logo-sub {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--red);
  margin-top: 0.3rem;
  display: block;
}

/* — Collapsible main nav — */
.isrl-nav-toggle {
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--font-mono);
  font-size: 0.74rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-muted);
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0;
  width: 100%;
  text-align: left;
  transition: color 0.15s;
}
.isrl-nav-toggle:hover { color: var(--ink); }
.isrl-nav-toggle:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
}

.isrl-nav-arrow {
  display: inline-block;
  font-size: 0.55rem;
  color: var(--ink-muted);
  transition: transform 0.2s ease;
  line-height: 1;
  font-style: normal;
}
.isrl-nav-toggle[aria-expanded="true"] .isrl-nav-arrow {
  transform: rotate(90deg);
}

.isrl-nav-panel {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.22s ease;
}
.isrl-nav-panel.open { max-height: 300px; }

.isrl-nav-list {
  list-style: none;
  padding: 0.6rem 0 0.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.38rem;
}
.isrl-nav-list a {
  font-family: var(--font-mono);
  font-size: 0.77rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--ink-mid);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  transition: color 0.15s;
}
.isrl-nav-list a::before {
  content: '→';
  color: var(--rule);
  font-size: 0.75rem;
  transition: color 0.15s, transform 0.15s;
  display: inline-block;
}
.isrl-nav-list a:hover { color: var(--navy); }
.isrl-nav-list a:hover::before { color: var(--navy); transform: translateX(2px); }
.isrl-nav-list a:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
  border-radius: 2px;
}

/* — Divider — */
.isrl-toc-divider {
  height: 1px;
  background: var(--rule-light);
  margin: 0.8rem 0;
  flex-shrink: 0;
}

/* — Table of contents — */
.isrl-toc-wrap {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
  scrollbar-width: thin;
  scrollbar-color: var(--rule-light) transparent;
}

.isrl-toc-label {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  display: block;
  margin-bottom: 0.5rem;
  flex-shrink: 0;
}

.isrl-toc { list-style: none; }
.isrl-toc li { display: block; }

.isrl-toc a {
  font-family: var(--font-mono);
  font-size: 0.73rem;
  line-height: 1.35;
  color: var(--ink-mid);
  text-decoration: none;
  display: block;
  padding: 0.27rem 0 0.27rem 0.5rem;
  border-left: 2px solid transparent;
  transition: color 0.15s, border-color 0.15s;
}
.isrl-toc a:hover {
  color: var(--navy);
  border-left-color: var(--navy);
}
.isrl-toc a:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 1px;
}
.isrl-toc a.toc-active {
  color: var(--navy);
  border-left-color: var(--navy);
}
/* Subsection indent */
.isrl-toc li.toc-h3 a {
  padding-left: 1rem;
  font-size: 0.69rem;
  color: var(--ink-muted);
}
.isrl-toc li.toc-h3 a:hover { color: var(--navy); }

/* — Sidebar footer — */
.isrl-sidebar-footer {
  padding-top: 1rem;
  margin-top: 0.75rem;
  border-top: 1px solid var(--rule-light);
  flex-shrink: 0;
}
.isrl-sidebar-footer p {
  font-family: var(--font-mono);
  font-size: 0.67rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-muted);
  line-height: 1.65;
}


/* ═════════════════════════════════════════════════════════════
   MAIN CONTENT — LaTeXML page wrapper
   (class names are exactly as LaTeXML 0.8.8 outputs them)
   ════════════════════════════════════════════════════════════ */
.ltx_page_main {
  grid-column: 2;
  border-right: 1px solid var(--rule);
  padding: 3.25rem 3.75rem 5rem 3.75rem;
  min-width: 0; /* prevent overflow */
}

.ltx_page_content {
  max-width: var(--content-max);
}

/* ── Document title ─────────────────────────────────────── */
h1.ltx_title.ltx_title_document {
  font-family: var(--font-title);
  font-size: clamp(1.65rem, 3vw, 2.45rem);
  font-weight: 700;
  font-style: normal;
  line-height: 1.18;
  color: var(--ink);
  margin-bottom: 1.35rem;
  letter-spacing: -0.015em;
  /* Libre Baskerville is tighter — give it space to breathe */
  word-spacing: 0.01em;
}

/* ── Authors ────────────────────────────────────────────── */
.ltx_authors { margin-bottom: 0.4rem; }
.ltx_creator.ltx_role_author { display: block; }

.ltx_personname {
  font-family: var(--font-mono);
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  color: var(--ink-mid);       /* #3a3a38 — clearly legible */
  line-height: 1.9;
  display: block;
  text-transform: uppercase;
}
/* email / affiliation rendered as typewriter inside personname */
.ltx_personname .ltx_text.ltx_font_typewriter,
.ltx_personname a {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  color: var(--ink-muted);
  text-transform: none;
  letter-spacing: 0;
  text-decoration: none;
}

/* ── Date ───────────────────────────────────────────────── */
.ltx_dates {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  letter-spacing: 0.04em;
  color: var(--ink-mid);       /* not muted — readable at a glance */
  display: block;
  margin: 0.75rem 0 1.85rem 0;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--rule);
}

/* ── Document type badge (injected by script) ───────────── */
.isrl-doc-badge {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #fff;
  background: var(--navy);
  padding: 0.18rem 0.55rem;
  margin-bottom: 1.35rem;
}
.isrl-doc-badge[data-type="report"] { background: var(--navy); }
.isrl-doc-badge[data-type="paper"]  { background: #2c5c3f; }
.isrl-doc-badge[data-type="audit"]  { background: #7a2c2c; }

/* ── Abstract ───────────────────────────────────────────── */
.ltx_abstract {
  background: rgba(44, 52, 107, 0.05);
  border-left: 3px solid var(--navy);
  padding: 1rem 1.25rem;
  margin-bottom: 2.25rem;
}
h6.ltx_title.ltx_title_abstract {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  font-weight: 500;
  display: block;
  margin-bottom: 0.55rem;
}
.ltx_abstract p.ltx_p {
  font-size: 1.05rem;
  line-height: 1.72;
  color: var(--ink-mid);
}

/* ── Section ────────────────────────────────────────────── */
.ltx_section { margin-bottom: 0; }

h2.ltx_title.ltx_title_section {
  font-family: var(--font-title);
  font-size: 1.3rem;
  font-weight: 700;
  font-style: normal;
  color: var(--ink);
  line-height: 1.25;
  margin-top: 2.75rem;
  margin-bottom: 0.9rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--rule);
  letter-spacing: -0.005em;
}
.ltx_tag.ltx_tag_section {
  font-family: var(--font-mono);
  font-size: 0.78rem;
  color: var(--ink-muted);
  font-weight: 400;
  margin-right: 0.3em;
  vertical-align: baseline;
}

/* ── Subsection ─────────────────────────────────────────── */
.ltx_subsection { margin-bottom: 0; }

h3.ltx_title.ltx_title_subsection {
  font-family: var(--font-title);
  font-size: 1.1rem;
  font-weight: 700;
  font-style: italic;
  color: var(--ink);
  line-height: 1.3;
  margin-top: 1.65rem;
  margin-bottom: 0.65rem;
}
.ltx_tag.ltx_tag_subsection {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  color: var(--ink-muted);
  font-weight: 400;
  margin-right: 0.3em;
}

/* ── Sub-subsection ─────────────────────────────────────── */
.ltx_subsubsection { margin-bottom: 0; }

h4.ltx_title.ltx_title_subsubsection {
  font-family: var(--font-body);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.38;
  margin-top: 1.25rem;
  margin-bottom: 0.5rem;
}
.ltx_tag.ltx_tag_subsubsection {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  color: var(--ink-muted);
  font-weight: 400;
  margin-right: 0.25em;
}

/* ── Paragraphs ─────────────────────────────────────────── */
.ltx_para { margin-bottom: 0.85rem; }

p.ltx_p {
  font-family: var(--font-body);
  font-size: 1.1rem;
  line-height: 1.75;
  color: var(--ink);
}

/* ── Inline formatting ──────────────────────────────────── */
.ltx_text.ltx_font_italic    { font-style: italic; }
.ltx_text.ltx_font_bold      { font-weight: 700; }
.ltx_text.ltx_font_smallcaps { font-variant: small-caps; }
.ltx_text.ltx_font_typewriter {
  font-family: var(--font-mono);
  font-size: 0.88em;
  background: rgba(0,0,0,0.05);
  padding: 0.05em 0.28em;
  border-radius: 2px;
  color: var(--ink-mid);
}

br.ltx_break {
  display: block;
  content: '';
  margin-top: 0.08rem;
}

/* ── Lists ──────────────────────────────────────────────── */
ul.ltx_itemize,
ol.ltx_enumerate {
  list-style: none;
  margin: 0.55rem 0 0.85rem 0;
  padding: 0;
}

li.ltx_item {
  display: grid;
  grid-template-columns: 1.55rem 1fr;
  align-items: baseline;
  margin-bottom: 0.3rem;
}
.ltx_tag.ltx_tag_item {
  font-family: var(--font-mono);
  font-size: 0.85rem;
  color: var(--ink-muted);
  justify-self: start;
  padding-top: 0.04em;
}
li.ltx_item .ltx_para  { margin-bottom: 0; }
li.ltx_item p.ltx_p    { font-size: 1.05rem; line-height: 1.68; }

/* nested */
li.ltx_item ul.ltx_itemize,
li.ltx_item ol.ltx_enumerate {
  grid-column: 2;
  margin-top: 0.3rem;
  margin-bottom: 0;
}

/* ── Bibliography ───────────────────────────────────────── */
section.ltx_bibliography {
  margin-top: 2.5rem;
  padding-top: 1.1rem;
  border-top: 1px solid var(--rule);
}
h2.ltx_title.ltx_title_bibliography {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  font-weight: 500;
  margin-bottom: 0.9rem;
  /* Override section border — bib title doesn't need its own */
  border: none;
  padding: 0;
  margin-top: 0;
}
ul.ltx_biblist {
  list-style: none;
  padding: 0;
  margin: 0;
}
li.ltx_bibitem {
  display: grid;
  grid-template-columns: 2.5rem 1fr;
  align-items: baseline;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--rule-light);
}
li.ltx_bibitem:first-child { border-top: 1px solid var(--rule-light); }

.ltx_tag.ltx_tag_bibitem {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  color: var(--ink-muted);
  justify-self: start;
}
.ltx_bibblock {
  font-family: var(--font-body);
  font-size: 0.93rem;
  line-height: 1.6;
  color: var(--ink-mid);
}
.ltx_bibblock .ltx_text.ltx_font_italic { font-style: italic; }

/* ── Acknowledgements (unnumbered section, id like Sx1) ─── */
section[id^="Sx"] h2.ltx_title_section {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
  font-style: normal;
  font-weight: 500;
  border-top: 1px solid var(--rule);
  padding-top: 1.25rem;
  margin-top: 2.5rem;
  margin-bottom: 0.7rem;
}
section[id^="Sx"] .ltx_tag_section { display: none; }
section[id^="Sx"] p.ltx_p {
  font-size: 1rem;
  color: var(--ink-mid);
  font-style: italic;
}

/* ── LaTeXML page footer ────────────────────────────────── */
footer.ltx_page_footer {
  margin-top: 2.5rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--rule-light);
}
.ltx_page_logo {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  color: var(--ink-muted);
  letter-spacing: 0.03em;
}
.ltx_page_logo a { color: var(--ink-muted); text-decoration: none; }
.ltx_page_logo img { height: 0.8em; vertical-align: middle; opacity: 0.4; }

/* links in content */
.ltx_page_content a {
  color: var(--navy);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ltx_page_content a:hover { color: var(--ink); }


/* ═════════════════════════════════════════════════════════════
   RIGHT SIDEBAR — Document metadata
   ════════════════════════════════════════════════════════════ */
.isrl-right {
  grid-column: 3;
  padding: 3.25rem 1.5rem 2rem 1.5rem;
  display: flex;
  flex-direction: column;
}

.isrl-right-section { margin-bottom: 1.85rem; }

.isrl-right-label {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);              /* full ink — it's a label, not decoration */
  border-bottom: 1px solid var(--ink);
  padding-bottom: 0.4rem;
  margin-bottom: 0.8rem;
  display: block;
}

.isrl-right-meta {
  font-family: var(--font-mono);
  font-size: 0.76rem;
  line-height: 1.8;
  color: var(--ink-mid);          /* #3a3a38 — clearly readable, not grey */
}
.isrl-right-meta strong {
  display: block;
  color: var(--ink);
  font-weight: 500;
  margin-bottom: 0.15rem;
}
.isrl-right-meta a {
  color: var(--navy);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.15s;
}
.isrl-right-meta a:hover { color: var(--ink); }
.isrl-right-meta a:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
}
.meta-doi {
  font-size: 0.7rem;
  word-break: break-all;
  color: var(--ink-mid);
  line-height: 1.5;
}

.isrl-right-footer {
  margin-top: auto;
  padding-top: 1.25rem;
  border-top: 1px solid var(--rule-light);
}
.isrl-right-footer p {
  font-family: var(--font-mono);
  font-size: 0.67rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-muted);
  line-height: 1.65;
}


/* ═════════════════════════════════════════════════════════════
   MOBILE HEADER & DRAWER
   ════════════════════════════════════════════════════════════ */
.isrl-mobile-header {
  display: none;
  position: sticky;
  top: 0;
  z-index: 200;
  background: var(--bg);
  border-bottom: 1px solid var(--rule);
  padding: 1rem 1.5rem;
  align-items: center;
  justify-content: space-between;
}
.isrl-mobile-logo {
  font-family: var(--font-title);
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--ink);
  text-decoration: none;
  letter-spacing: -0.01em;
}
.isrl-mobile-logo .logo-i { font-style: italic; }

.isrl-hamburger {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.2rem;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.isrl-hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--ink);
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.isrl-hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.isrl-hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.isrl-hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.isrl-hamburger:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; }

.isrl-mobile-drawer {
  display: none;
  position: fixed;
  inset: 0;
  background: var(--bg);
  z-index: 199;
  padding: 5rem 2rem 2rem;
  overflow-y: auto;
}
.isrl-mobile-drawer.open { display: block; }

.isrl-mobile-drawer-logo {
  position: absolute;
  top: 1.1rem;
  left: 1.5rem;
  font-family: var(--font-title);
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--ink);
  text-decoration: none;
  letter-spacing: -0.01em;
}
.isrl-mobile-drawer-logo .logo-i { font-style: italic; }

.isrl-mobile-drawer .isrl-nav-list {
  gap: 1.1rem;
  padding: 0;
}
.isrl-mobile-drawer .isrl-nav-list a { font-size: 1rem; }


/* ═════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════ */

/* Tablet: drop right sidebar */
@media (max-width: 1160px) {
  :root { --sidebar-w: 220px; }
  .isrl-shell { grid-template-columns: var(--sidebar-w) 1fr; }
  .isrl-right { display: none; }
  .ltx_page_main { border-right: none; padding: 2.75rem 2.5rem 4rem; }
}

/* Mobile: full collapse */
@media (max-width: 780px) {
  .isrl-shell { grid-template-columns: 1fr; }
  .isrl-sidebar { display: none; }
  .isrl-mobile-header { display: flex; }
  .ltx_page_main {
    grid-column: 1;
    padding: 2rem 1.5rem 3.5rem;
    border: none;
  }
  h1.ltx_title.ltx_title_document { font-size: clamp(1.4rem, 6vw, 1.9rem); }
}

@media (max-width: 460px) {
  .ltx_page_main { padding: 1.5rem 1.1rem 3rem; }
  li.ltx_item    { grid-template-columns: 1.3rem 1fr; }
  li.ltx_bibitem { grid-template-columns: 2rem 1fr; }
}


/* ─────────────────────────────────────────────────────────────
   ACCESSIBILITY
───────────────────────────────────────────────────────────── */
:focus-visible {
  outline: 2px solid var(--navy);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition: none !important;
    animation: none !important;
  }
}


