/* Article presentation only. Existing post HTML and essay templates stay intact. */
.article-layout.cxv-article-layout {
  max-width: 1180px;
  grid-template-columns: minmax(0, 740px) minmax(200px, 240px);
  justify-content: center;
  gap: 48px;
  padding: 48px 32px 64px;
}
.cxv-article-layout .article-main { min-width: 0; max-width: 740px; overflow: visible; }
.cxv-article-layout .sidebar { min-width: 0; }
.cxv-article-layout .article-header { margin-bottom: 28px; }
.cxv-article-layout .article-title { font-size: clamp(26px, 2.7vw, 36px); line-height: 1.5; overflow-wrap: anywhere; }
.cxv-article-layout .article-meta { flex-wrap: wrap; gap: 7px 18px; font-size: 13px; line-height: 1.7; color: var(--c-text2); }
.cxv-article-layout .article-hero-img { aspect-ratio: auto; background: none; border: 0; overflow: visible; margin-bottom: 34px; }
.cxv-article-layout .article-hero-img img { width: 100%; height: auto; object-fit: contain; }
.cxv-article-layout .article-body { font-size: 18px; font-weight: 400; line-height: 1.9; overflow-wrap: break-word; }
.cxv-article-layout .article-body .cx-column-article { font-size: inherit; line-height: inherit; color: inherit; }
.cxv-article-layout .article-body > p,
.cxv-article-layout .article-body .cx-column-article p { font-size: inherit; line-height: inherit; margin: 0 0 1.4em; }
.cxv-article-layout .article-body h2 { font-family: var(--f-sans); font-size: 26px; line-height: 1.6; margin: 2.8em 0 1em; padding: 0 0 12px; border: 0; border-bottom: 1px solid var(--c-bdr); }
.cxv-article-layout .article-body h3 { font-family: var(--f-sans); font-size: 21px; line-height: 1.65; margin: 2em 0 .8em; padding: 0; border: 0; }
.cxv-article-layout .article-body h4 { font-size: 18px; line-height: 1.7; margin: 1.7em 0 .6em; }
.cxv-article-layout .article-body .cx-column-article h2::after { content: none; }
.cxv-article-layout .article-body :is(h2, h3, h4, [id]) { scroll-margin-top: 96px; }
.cxv-article-layout .article-body > :is(ul, ol),
.cxv-article-layout .article-body .cx-column-article > :is(ul, ol),
.cxv-article-layout .article-body .wp-block-list { padding-left: 1.5em; margin: 0 0 1.4em; }
.cxv-article-layout .article-body .wp-block-list :is(ul, ol) { padding-left: 1.4em; margin: .4em 0; }
.cxv-article-layout .article-body li { margin-bottom: .4em; }
.cxv-article-layout .article-body blockquote { margin: 1.8em 0; padding: 12px 22px; border-left: 3px solid var(--c-rule); background: var(--c-bg2); }
.cxv-article-layout .article-body blockquote cite { display: block; font-size: 14px; color: var(--c-text2); }
.cxv-article-layout .article-body :is(p, li, td, dd, figcaption) a { color: var(--c-acc-dim); text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1px; }
.cxv-article-layout .article-body :is(p, li, td, dd, figcaption) a:hover { text-decoration-thickness: 2px; }
.cxv-article-layout :is(a, button, summary, [tabindex]):focus-visible { outline: 3px solid var(--c-acc); outline-offset: 4px; }
.cxv-article-layout .art-card-link:focus-visible { outline-offset: -4px; }
.cxv-article-layout .article-body .wp-block-button__link { text-decoration: none; }
.cxv-article-layout .article-body :is(img, svg, video) { max-width: 100%; height: auto; }
.cxv-article-layout .article-body figure { max-width: 100%; margin: 1.7em 0; }
.cxv-article-layout .article-body .wp-block-image img { height: auto; object-fit: contain; }
.cxv-article-layout .article-body :is(figcaption, .wp-caption-text, .chart-caption, .journey-caption) { font-size: 13px; color: var(--c-text2); line-height: 1.75; margin-top: 10px; }
.cxv-article-layout .article-body .wp-caption { max-width: 100%; }
.cxv-article-layout .article-body .aligncenter { margin-left: auto; margin-right: auto; }
.cxv-article-layout .article-body :is(.alignwide, .alignfull) { max-width: 100%; width: auto; margin-left: 0; margin-right: 0; }
.cxv-article-layout .article-body .footnotes p { font-size: 13px; color: var(--c-text2); line-height: 1.8; }
.cxv-article-layout .article-body pre { max-width: 100%; overflow-x: auto; padding: 16px; font-size: 14px; background: var(--c-bg2); }

/* Reuse classic wrappers and the native table-block figure; only tables scroll. */
.cxv-article-layout .article-body :is(.table-wrap, .table-responsive, .wp-block-table, .cxv-table-scroll) { display: block; min-width: 0; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 16px 0 28px; }
.cxv-article-layout .article-body table:not(.cx-card-table) { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.75; }
.cxv-article-layout .article-body .table-wrap table:not(.cx-card-table) { min-width: 0; }
.cxv-article-layout .article-body :is(.table-wrap, .table-responsive, .wp-block-table, .cxv-table-scroll) table.cxv-wide-table { min-width: 36rem; }
.cxv-article-layout .article-body :is(.table-wrap, .table-responsive, .wp-block-table, .cxv-table-scroll) table.cxv-wide-table--large { min-width: 48rem; }
.cxv-article-layout .article-body table:not(.cx-card-table) :is(th, td) { padding: 12px 14px; vertical-align: top; overflow-wrap: anywhere; }
.cxv-article-layout .article-body table .cxv-table-abbreviation { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.cxv-article-layout .article-body table caption { text-align: left; font-weight: 600; margin-bottom: 10px; }
.cxv-article-layout .article-body .cxv-scroll-hint { font-size: 12px; color: var(--c-text2); margin: 16px 0 6px; }
.cxv-article-layout .article-body .cxv-scroll-hint[hidden] { display: none; }

/* A post/plugin's existing table of contents takes precedence over the fallback. */
.cxv-article-layout .article-body :is(.toc, .cxv-toc) { max-width: 100%; padding: 20px 24px; margin: 28px 0 38px; border: 1px solid var(--c-bdr); border-left: 3px solid var(--c-acc); border-radius: 2px; background: var(--c-bg2); }
.cxv-article-layout .article-body .toc :is(h2, h3),
.cxv-article-layout .article-body .toc-title { font-family: var(--f-sans); font-size: 16px; line-height: 1.6; border: 0; padding: 0; margin: 0 0 10px; }
.cxv-article-layout .article-body .toc :is(h2, h3)::after { content: none; }
.cxv-article-layout .article-body :is(.toc, .cxv-toc) a { font-size: 15px; line-height: 1.65; color: var(--c-acc-dim); text-decoration: none; }
.cxv-article-layout .article-body :is(.toc, .cxv-toc) a:hover { text-decoration: underline; }
.cxv-article-layout .article-body .cxv-toc summary { font-size: 16px; font-weight: 700; cursor: pointer; }
.cxv-article-layout .article-body .cxv-toc ol { padding-left: 1.5em; margin: 12px 0 0; list-style: decimal; }
.cxv-article-layout .article-body .cxv-toc ol ol { list-style: disc; margin: 5px 0 0; }
.cxv-article-layout .article-body .cxv-toc li { margin: 6px 0; }

.cxv-article-layout .cxk-post-tpl-grid { grid-template-columns: minmax(0, 1fr); }
.cxv-article-layout .cxk-post-tpl-card { display: grid; grid-template-columns: minmax(0, 180px) minmax(0, 1fr); }
.cxv-article-layout .cxk-post-tpl-thumb { height: auto; align-self: start; }
.cxv-article-layout .cxk-post-tpl-body { min-width: 0; }
.cxv-article-layout .share-section { margin-top: 32px; padding: 18px 0; }
.cxv-article-layout .related-title { font-size: 22px; }
.cxv-article-layout .sidebar-title { font-size: 16px; }
.cxv-article-layout .sidebar-popular .pop-num { color: var(--c-text2); }
.cxv-article-layout .sidebar .profile-body { font-size: 13px; }

@media (max-width: 1000px) {
  .article-layout.cxv-article-layout { grid-template-columns: minmax(0, 740px); padding: 34px 24px 56px; gap: 42px; }
  .cxv-article-layout .sidebar { position: static; max-width: 740px; }
}
@media (max-width: 600px) {
  .article-layout.cxv-article-layout { padding: 28px 20px 48px; }
  .cxv-article-layout .article-body { font-size: 17px; line-height: 1.9; }
  .cxv-article-layout .article-body h2 { font-size: 23px; }
  .cxv-article-layout .article-body h3 { font-size: 20px; }
  .cxv-article-layout .article-body :is(.toc, .cxv-toc) { padding: 18px; }
  .cxv-article-layout .article-body .cx-card-table { min-width: 0; max-width: 100%; }
  .cxv-article-layout .cxk-post-tpl-card { grid-template-columns: minmax(0, 1fr); }
  .cxv-article-layout .cxk-post-tpl-thumb { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
@media print {
  .article-layout.cxv-article-layout { display: block; padding: 0; max-width: none; }
  .cxv-article-layout .article-main { max-width: none; }
  .cxv-article-layout :is(.sidebar, .share-section, .related, .cxk-post-tpl) { display: none; }
  .cxv-article-layout .article-body :is(.table-wrap, .table-responsive, .wp-block-table, .cxv-table-scroll) { overflow: visible; }
  .cxv-article-layout .article-body table.cxv-wide-table,
  .cxv-article-layout .article-body table.cxv-wide-table--large { min-width: 0; }
  .cxv-article-layout .cxv-scroll-hint { display: none; }
}
