/* Shared browsing width, with the theme's reading measure for posts. */
html:root {
  --site-gutter: 20px;
  --site-layout-width: 1120px;
  --container-width: var(--site-layout-width);
  --content-width: var(--site-layout-width);
  --wide-width: var(--site-layout-width);
  --content-width-wide: var(--site-layout-width);
}
body [data-header], body [data-footer],
body main.main > section.px-4 {
  padding-inline: max(var(--site-gutter), env(safe-area-inset-left)) max(var(--site-gutter), env(safe-area-inset-right));
}
body main.main .ghost-content { --gap: var(--site-gutter); min-width: 0; }
body main.main .ghost-content > * { min-width: 0; }
body main.main [data-post-card], body main.main [data-post-card] > * { min-width: 0; }
body main.main [data-post-card-title], body main.main [data-post-card-excerpt] { overflow-wrap: anywhere; }
body main.main .ghost-content :is(pre, table) { max-width: 100%; overflow-x: auto; }
body main.main .ghost-content table { display: block; }
body main.main .ghost-content :is(iframe, video) { max-width: 100%; }
body main.main #comments .siwei-fc-panel {
  width: min(var(--content-width), calc(100% - var(--site-gutter) * 2));
}
/* Keep catalog ordering intact while adding columns on larger screens. */
body main.main [data-feed-layout="grid"] {
  grid-template-columns: minmax(0, 1fr);
  column-gap: clamp(20px, 2.5vw, 36px);
}
@media (min-width: 640px) {
  body main.main [data-feed-layout="grid"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* TOC pages use one outside gutter instead of narrowing the article twice. */
body main.main [data-post-content] {
  width: calc(100% - var(--site-gutter) * 2);
  max-width: var(--wide-width);
  gap: 24px;
  flex-direction: column;
}
body main.main [data-post-content] .ghost-content { --gap: 0px; }
body main.main [data-post-content] [data-toc] { padding-inline: 0; }
/* Keep all outer content edges on the same grid, including full-width cards. */
body main.main .ghost-content > .kg-width-full { grid-column: main-start / main-end; }
body main.main :is([data-page-hero], [data-tag], [data-author]) > div { max-width: var(--site-layout-width); }
/* The contents list sits above the article, leaving the full reading measure. */
body main.main [data-post-content] [data-toc] { max-width: none; flex: none; }
body main.main [data-toc] > div { position: static; border-bottom: 1px solid var(--color-border); }
body main.main [data-toc-toggle] { justify-content: center; cursor: pointer; border: 1px solid var(--color-border); padding: 12px 16px; }
body main.main [data-toc-toggle] .icon { visibility: visible; }
body main.main [data-toc-content].hidden { display: none; }
body main.main [data-hero-content] { max-width: var(--site-layout-width); }
body.page-sci-journal-finder main.main #sjq .jq-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); }
@media(max-width:760px) { body.page-sci-journal-finder main.main #sjq .jq-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:560px) { body.page-sci-journal-finder main.main #sjq .jq-metrics { grid-template-columns: minmax(0,1fr); } }
@media (min-width: 1024px) {
  body main.main [data-feed-layout="grid"] { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

/* Flair's default reading width for articles and the guestbook. */
body:is(.post-template, .page-message-board) main.main {
  --content-width: 680px;
  --content-width-wide: 960px;
  --wide-width: 1024px;
}
body.post-template main.main .ghost-content:not([data-no-overflow]) > .kg-width-full {
  grid-column: full-start / full-end;
}