/* Additions to the blog's existing styling (landing_page.min.css owns .blog-section,
 * .post-content and friends). Only the elements added for discoverability live here:
 * breadcrumbs, an on-page table of contents, post summaries on the index, and the
 * cross-links that stop a post from being a dead end.
 *
 * Palette matches the existing blog styling: #06091b surfaces, #30363d hairlines,
 * #E6F1FF text, #4dd8ff accent. */

.post-crumbs {
  font-size: 0.85rem;
  color: #7d8aa3;
  margin-bottom: 1.25rem;
  line-height: 1.6;
}
.post-crumbs a { color: #9fb0cc; text-decoration: none; }
.post-crumbs a:hover { color: #4dd8ff; text-decoration: underline; }
.post-crumbs span[aria-hidden] { opacity: 0.5; margin: 0 4px; }
.post-crumbs [aria-current] { color: #E6F1FF; }

.post-toc {
  background-color: #06091b;
  border: 1px solid #30363d;
  border-radius: 8px;
  padding: 1.15rem 1.5rem;
  margin: 2rem 0 0;
}
.post-toc-label {
  display: block;
  font-size: 0.72rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #7d8aa3;
  margin-bottom: 0.6rem;
}
.post-toc ol {
  margin: 0;
  padding-left: 1.25rem;
  color: #9fb0cc;
  font-size: 0.98rem;
  line-height: 1.85;
}
.post-toc a { color: #9fb0cc; text-decoration: none; }
.post-toc a:hover { color: #4dd8ff; text-decoration: underline; }

/* Index summaries. The index used to be titles only. */
.post-summary {
  margin: 0.65rem 0 0;
  color: #9fb0cc;
  font-size: 1rem;
  line-height: 1.6;
}

/* A post that links nowhere is a leaf: readers leave and crawlers stop. */
.post-related,
.blog-more {
  margin-top: 3rem;
  padding-top: 1.75rem;
  border-top: 1px solid #30363d;
}
.post-related h2,
.blog-more h2 {
  font-size: 1.15rem;
  margin: 0 0 1rem;
  color: #E6F1FF;
}
.post-related ul,
.blog-more ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0.5rem;
}
.post-related a,
.blog-more a {
  display: block;
  padding: 0.75rem 1rem;
  background-color: #06091b;
  border: 1px solid #30363d;
  border-radius: 8px;
  color: #E6F1FF;
  text-decoration: none;
  font-size: 0.98rem;
}
.post-related a:hover,
.blog-more a:hover { border-color: #4dd8ff; color: #4dd8ff; }

/* Tables come from the markdown `tables` extension and had no styling at all, so a
 * comparison table in a post rendered as run-together text. */
.post-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
  font-size: 0.97rem;
  white-space: normal;
  display: block;
  overflow-x: auto;
}
.post-content table th,
.post-content table td {
  text-align: left;
  padding: 0.7rem 0.9rem;
  border-bottom: 1px solid #30363d;
  vertical-align: top;
  line-height: 1.5;
}
.post-content table thead th {
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #7d8aa3;
  background-color: rgba(255, 255, 255, 0.03);
  white-space: nowrap;
}
.post-content h2 { margin-top: 2.4rem; font-size: 1.55rem; line-height: 1.25; }
.post-content h3 { margin-top: 1.8rem; font-size: 1.2rem; line-height: 1.3; }
.post-content a { color: #4dd8ff; }
.post-content img { max-width: 100%; height: auto; border-radius: 8px; }

/* Computed related posts. Two lines per row (title plus its description) because a bare list
 * of titles gives a reader nothing to choose on, which is the same reason the blog index
 * gained summaries. */
.post-related-summary {
  display: block;
  margin-top: 0.3rem;
  color: #7d8aa3;
  font-size: 0.88rem;
  line-height: 1.5;
}