/* The leaderboard and blog pages (src/seo/), on top of site.css. Only site.css tokens are used,
   so both color schemes follow it. */

.crumbs ol { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; font-size: 14px; color: var(--muted); }
.crumbs li { margin: 0; max-width: none; }
.crumbs li + li::before { content: "/"; margin: 0 8px; color: var(--field); }
.crumbs a { color: var(--muted); }
.crumbs [aria-current] { color: var(--text); overflow-wrap: anywhere; }

.data-page .wrap { max-width: 920px; }
.lb-meta, .lb-scope, .post-meta { color: var(--muted); font-size: 15px; max-width: 72ch; }
.lb-jump { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 20px 0 8px; font-size: 15px; font-weight: 600; }
.lb-jump a { display: inline-flex; align-items: center; min-height: 44px; }
.lb-section h3 { font-size: 20px; line-height: 1.3; margin: 32px 0 6px; }
.lb-section { scroll-margin-top: calc(var(--header) + 12px); }
.lb-section h2, .lb-section h3 { scroll-margin-top: calc(var(--header) + 12px); }
.lb-empty { color: var(--muted); border: 1px dashed var(--border); border-radius: var(--radius); padding: 16px 18px; }

.guide .lb-list { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 10px; }
.guide .lb-list > li { max-width: none; margin: 0; }
.lb-row {
  display: grid; grid-template-columns: 2.2em minmax(0, 1fr); gap: 4px 12px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 16px;
}
.lb-row p { margin: 0; }
.lb-rank { grid-row: 1 / span 3; font: 600 18px/1.4 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; }
.lb-main, .lb-facts, .lb-link, .lb-filings { grid-column: 2; min-width: 0; }
.lb-company { font-weight: 600; font-size: 17px; overflow-wrap: anywhere; }
.lb-who { color: var(--muted); font-size: 15px; overflow-wrap: anywhere; }
.lb-kind { margin-top: 6px !important; display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; font-size: 14px; }
.lb-tag { display: inline-block; border-radius: 999px; padding: 2px 10px; font-size: 13px; font-weight: 600; background: var(--wash); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); }
.lb-tag.lb-sell { background: color-mix(in srgb, var(--sold) 8%, transparent); color: var(--sold); border-color: color-mix(in srgb, var(--sold) 35%, transparent); }
.lb-plan { color: var(--muted); }
.lb-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 6px 14px; margin: 10px 0 0; }
.lb-facts dt { font-size: 13px; color: var(--muted); }
.lb-facts dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.lb-link { margin-top: 8px !important; font-size: 15px; }
.lb-sec { display: inline-flex; align-items: center; min-height: 32px; font-weight: 600; }
.guide .lb-filings { margin: 10px 0 0; padding-left: 18px; font-size: 14px; color: var(--muted); }
.guide .lb-filings li { margin: 0 0 4px; overflow-wrap: anywhere; }

.related ul { padding-left: 22px; }

.guide .post-cards { list-style: none; padding: 0; margin: 24px 0; display: grid; gap: 12px; }
.guide .post-card { max-width: none; margin: 0; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 18px 20px; }
.post-card h2 { font-size: 21px; line-height: 1.3; margin: 4px 0 6px; letter-spacing: -0.015em; }
.post-card h2 a { color: var(--text); text-decoration: none; }
.post-card h2 a:hover { text-decoration: underline; }
.post-card p { margin: 0; color: var(--muted); font-size: 15px; }
.post-kind { font-size: 13px !important; font-weight: 600; color: var(--accent) !important; }
.post h1 { font-size: clamp(32px, 4.6vw, 48px); }
.guide .post-list { padding-left: 24px; }
.guide .post-list li { margin-bottom: 12px; overflow-wrap: anywhere; }
.post-pager { display: grid; gap: 8px; margin: 32px 0 8px; font-size: 15px; }
.post-pager a { display: inline-flex; align-items: center; min-height: 44px; }

@media (max-width: 560px) {
  .lb-row { grid-template-columns: minmax(0, 1fr); padding: 14px; }
  .lb-rank { grid-row: auto; font-size: 14px; }
  .lb-main, .lb-facts, .lb-link, .lb-filings { grid-column: 1; }
  .lb-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}