/* Shared styles for technical department pages */
/* (Body scaffold — min-height + header-clearing padding — lives in style.css.) */
/* Black-ink baseline. :where() keeps it at zero specificity so any classed
   rule (style.css components like .lede, .meta-label, page rules) can set its
   own color without a specificity fight — this only catches bare elements. */
:where(.main, .main *, .site-header, .site-header *) { color: var(--ink); }
.main a:hover, .site-header a:hover { color: var(--ink); }
.main {
  width: min(720px, 90vw);
  margin: 0 auto;
}
/* .page-title and .section-title come from style.css; dept pages give
   sections extra breathing room. */
.section-title { margin-top: 5rem; }
.subsection-title {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.2;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  margin: 4rem 0 0.85rem;
}
/* Bare headings inside long-form markdown bodies (lab notes, field notes, dept pages).
   These apply to <h1>…<h4> rendered from a Body field (kt()) and inherit consistently
   across templates so each page doesn't redefine its own scale. */
.main h1 {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 2.4rem;
  line-height: 1.2;
  text-transform: uppercase;
  margin: 0 0 0.5rem;
  text-decoration: underline;
  text-decoration-thickness: 5px;
  text-underline-offset: 0.12em;
}
.main h2 {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 1.25;
  text-transform: uppercase;
  margin: 4rem 0 1rem;
}
.main h3 {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.3;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  margin: 3rem 0 0.5rem;
}
.main h4 {
  font-family: var(--font-text);
  font-weight: 700;
  font-size: 1.3rem;
  margin: 2rem 0 0.35rem;
}
.main a {
  color: var(--ink);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.15em;
  text-decoration-skip-ink: none;
}
.main ul {
  list-style: none;
  padding: 0;
  margin: 0 0 0.9rem;
}
.main ul li {
  font-family: var(--font-text);
  font-size: 1.15rem;
  line-height: 1.5;
  position: relative;
  padding-left: 1.75em;
  margin-bottom: 0.25rem;
}
/* Em-dash bullets, matching voxel.org's list style. */
.main ul li::before {
  content: '\2014';
  position: absolute;
  left: 0;
}
.main ul ul {
  margin: 0.3rem 0 0.5rem;
  padding-left: 0;
}
.main ul ul li {
  font-size: 1.15rem;
  padding-left: 1.75em;
  margin-bottom: 0.1rem;
}
/* Writer stores list items as <li><p>…</p></li>; drop the paragraph's trailing
   margin so items stay dense rather than spaced a full line apart. */
.main li p:last-child {
  margin-bottom: 0;
}
/* .back-link comes from style.css. */
.note {
  font-style: italic;
  color: var(--ink-muted);
  font-size: 0.95rem;
}
.main img {
  display: block;
  width: 100%;
  height: auto;
  margin: 1.25rem 0;
}
/* Ordered lists and any plain article tables/code in long-form notes */
.main ol {
  padding-left: 1.5rem;
  margin: 0 0 0.9rem;
}
.main ol li {
  font-family: var(--font-text);
  font-size: 1.15rem;
  line-height: 1.5;
  margin-bottom: 0.25rem;
}
.main hr {
  border: 0;
  border-top: 2px solid #000;
  margin: 2.5rem 0;
}
.main blockquote {
  margin: 1.5rem 0;
  padding: 0 0 0 1.25rem;
  border-left: 2px solid #000;
  font-style: italic;
}
/* .lede comes from style.css. */

/* ====================================================================
   Technical Manual — inventory summary headings (markdown → dept link)
   ==================================================================== */
.inventory h2 {
  font-size: 2rem;
  margin: 4rem 0 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.inventory h2 a { text-decoration: none; }
.inventory h2 a:hover { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 0.15em; }
.inventory h2 a::after {
  content: ' →';
  display: inline-block;
  transition: transform 120ms ease;
}
.inventory h2 a:hover::after { transform: translateX(3px); }

/* ====================================================================
   Technical Manual — PDF / VWX download lists + see-also + revision
   ==================================================================== */
.file-list { padding: 0; margin: 0 0 0.9rem; border-top: 1.5px solid #000; list-style: none; }
.file-list li { display: flex; align-items: baseline; justify-content: space-between; padding: 0.7rem 0 !important; margin-bottom: 0 !important; border-bottom: 1.5px solid #000; }
.file-list li::before { display: none !important; }
.file-list a { font-family: var(--font-mono); font-weight: 700; font-size: 1.05rem; text-transform: uppercase; text-decoration: none; flex: 1; }
.file-tag { font-family: var(--font-mono); font-size: 0.8rem; color: var(--ink-muted); text-transform: uppercase; }
/* Layout rows (.layout-row/.layout-col) come from style.css. */

.drawings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; }
.cad-revision-link { font-size: 0.95rem; color: var(--ink-muted); margin: 0.5rem 0 0; }
.cad-revisions { list-style: none; padding: 0; margin: 1.5rem 0 0; }
/* Scoped under .main to override the custom bullet (.main ul li::before) and
   its padding-left, so the revision list renders flush with no marker. */
.main .cad-revisions li { padding: 0.6rem 0; border-bottom: 1px solid #e5e5e5; font-size: 1rem; line-height: 1.5; }
.main .cad-revisions li::before { display: none; }
.main .cad-revisions li:last-child { border-bottom: 0; }
.cad-rev-date { font-family: var(--font-mono); color: var(--ink-muted); margin-right: 0.4rem; white-space: nowrap; }
.cad-revision-link a { color: inherit; text-decoration: underline; text-decoration-thickness: 2px; }
.see-also { font-size: 1.05rem; margin: 1.75rem 0 0; color: var(--ink-soft); }
.see-also a { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.15em; }
@media (max-width: 700px) { .drawings-grid { grid-template-columns: 1fr; gap: 0; } }

/* ====================================================================
   Lab Notes — single-note header (back link + #XYZ) and "More Lab Notes"
   ==================================================================== */
.lab-header { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; }
.lab-header .back-link { margin-bottom: 0; }
.lab-tag { font-family: var(--font-mono); text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.95rem; color: var(--ink-muted); }
.more-lab-notes { border-top: 2px solid #000; margin-top: 4rem; }
.more-lab-notes a { display: grid; grid-template-columns: 4rem 1fr; gap: 1rem; padding: 0.8rem 0; border-bottom: 1.5px solid #000; text-decoration: none !important; }
.more-lab-notes .num,
.more-lab-notes .ttl { font-family: var(--font-mono); font-weight: 700; font-size: 1.05rem; }
.more-lab-notes .ttl { text-transform: uppercase; }
.more-lab-notes a:hover .ttl { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 0.15em; }
.more-lab-notes a.current .ttl { color: var(--ink-faint); }
.more-lab-notes a.current { pointer-events: none; }

/* ====================================================================
   Lab Notes index — listing of all numbered lab notes
   ==================================================================== */
.lab-list { border-top: 2px solid #000; }
.lab-note { display: grid; grid-template-columns: 4.5rem 1fr; gap: 1.25rem; padding: 1.25rem 0; border-bottom: 1.5px solid #000; text-decoration: none !important; }
.lab-num { font-family: var(--font-mono); font-weight: 700; font-size: 1.4rem; }
.lab-body h2 { font-family: var(--font-mono); font-weight: 700; font-size: 1.4rem; text-transform: uppercase; margin: 0 0 0.4rem; }
.lab-body p { font-size: 1rem; color: var(--ink-soft); margin: 0; }
.lab-note:hover .lab-body h2 { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 0.15em; }

/* ====================================================================
   Field Notes index — feature-card listing
   ==================================================================== */
.note-card { display: block; padding: 1.5rem 0; border-top: 2px solid #000; text-decoration: none !important; }
.note-card:last-of-type { border-bottom: 2px solid #000; }
.note-card h2 { font-family: var(--font-mono); font-weight: 700; font-size: 1.8rem; text-transform: uppercase; margin: 0 0 0.5rem; text-decoration: none; }
.note-card p { font-size: 1.1rem; color: var(--ink-soft); margin: 0; }
.note-card:hover h2 { text-decoration: underline; text-decoration-thickness: 4px; text-underline-offset: 0.15em; }
.main p {
  font-family: var(--font-text);
  font-size: 1.15rem;
  line-height: 1.55;
  margin: 0 0 0.9rem;
}
.main table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  margin: 1rem 0 1.5rem;
  font-family: var(--font-text);
  font-size: 1.05rem;
  line-height: 1.45;
}
.main table th,
.main table td {
  word-break: break-word;
}
.main table th,
.main table td {
  padding: 0.55rem 0.75rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1.5px solid #000;
}
.main table thead th {
  font-family: var(--font-mono);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.04em;
  border-bottom: 2px solid #000;
  border-top: 2px solid #000;
}
.main pre {
  background: #f4f4f4;
  padding: 1rem 1.1rem;
  margin: 1rem 0 1.5rem;
  border-left: 4px solid #000;
  overflow-x: auto;
  font-family: var(--font-mono);
  font-size: 0.95rem;
  line-height: 1.5;
}
.main pre code { background: none; padding: 0; font-size: inherit; }
.main code {
  font-family: var(--font-mono);
  font-size: 0.95em;
  background: #f4f4f4;
  padding: 0.05em 0.35em;
  border-radius: 2px;
}

/* Lobby Patch table is dense — shrink it so 5 columns fit comfortably */
.main table.compact { font-size: 0.85rem; line-height: 1.35; }
.main table.compact th,
.main table.compact td { padding: 0.35rem 0.5rem; }
.main table.compact thead th { font-size: 0.75rem; }

/* Spec tables inherit everything from `.main table` above; they're just a
   touch smaller with tighter rows. */
table.spec { font-size: 1rem; }
table.spec th,
table.spec td { padding: 0.5rem 0.75rem; }

/* Guest Essays (field notes) use Courier for headings — a 'zine typewriter
   look, matching voxel.org's .zine styling. */
.guest-essay h1,
.guest-essay h2,
.guest-essay h3,
.guest-essay h4 {
  font-family: 'Courier', 'Courier New', monospace;
}

/* Footnote return arrow (jumps back to the reference). */
.main .fn-return { margin-left: 0.4em; font-size: 0.9em; text-decoration: none; }
.main .fn-return:hover { text-decoration: underline; }