/**
 * Ludo Louis editorial system — V0.
 *
 * Scoped to individual posts. Blocksy remains responsible for the site shell,
 * archive, navigation and global palette. No post ID is targeted here.
 */

body.single-post {
  --ll-reading-width: 70ch;
  --ll-figure-width: 84ch;
  --ll-wide-width: 70rem;
  --ll-page-gutter: clamp(1rem, 4vw, 3rem);
  --ll-prose-gap: clamp(1rem, 1.4vw, 1.35rem);
  --ll-section-gap: clamp(4rem, 8vw, 7.5rem);
  --ll-heading-gap: clamp(1.25rem, 2.5vw, 2rem);
  --ll-figure-gap: clamp(2rem, 4vw, 3.25rem);
  --ll-wide-figure-gap: clamp(2.5rem, 5vw, 4.5rem);
  --ll-surface-editorial: var(--theme-palette-color-7, #29363d);
  --ll-surface-editorial-raised: var(--theme-palette-color-6, #212b31);
  --ll-border-editorial: var(--theme-border-color, #384b56);
  --ll-text-editorial: var(--theme-text-color, #cad2c5);
  --ll-text-editorial-muted: color-mix(
    in srgb,
    var(--theme-text-color, #cad2c5) 70%,
    transparent
  );
  --ll-accent-editorial: var(--theme-palette-color-1, #84a98c);
  --ll-accent-editorial-strong: var(--theme-palette-color-2, #52796f);
  --ll-rule-width: 3.5rem;
}

/* Article frame and hero */
body.single-post article.post {
  overflow: clip;
  counter-reset: ll-signal;
}

/* Reading progress: a silent, article-scoped enhancement. */
body.single-post .ll-reading-progress {
  position: fixed;
  z-index: 100000;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  pointer-events: none;
  opacity: 0;
}

body.single-post.admin-bar .ll-reading-progress {
  top: var(--wp-admin--admin-bar--height, 32px);
}

body.single-post .ll-reading-progress.is-active {
  opacity: 1;
}

body.single-post .ll-reading-progress__value {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--ll-accent-editorial);
  transform: scaleX(var(--ll-reading-progress, 0));
  transform-origin: left center;
  will-change: transform;
}

body.single-post article.post > .hero-section,
body.single-post article.post > .entry-content,
body.single-post article.post > .ct-share-box {
  box-sizing: border-box;
  width: min(100%, calc(var(--ll-wide-width) + (2 * var(--ll-page-gutter))));
  margin-inline: auto;
  padding-inline: var(--ll-page-gutter);
}

body.single-post article.post > .hero-section {
  padding-block: clamp(4.25rem, 9vw, 7.5rem) clamp(2.75rem, 6vw, 4.75rem);
  border-bottom: 1px solid var(--ll-border-editorial);
}

body.single-post .hero-section .entry-header {
  width: min(100%, var(--ll-wide-width));
  margin-inline: auto;
}

body.single-post .hero-section .entry-header::before {
  display: block;
  width: var(--ll-rule-width);
  height: 2px;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--ll-accent-editorial);
  content: "";
}

body.single-post .hero-section .page-title {
  max-width: 25ch;
  margin: 0;
  color: var(--theme-headings-color, var(--ll-accent-editorial));
  font-family: var(--theme-font-family);
  font-size: clamp(2.25rem, 4.3vw, 3.75rem);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.02;
  text-wrap: balance;
}

body.single-post .hero-section .page-description {
  max-width: var(--ll-reading-width);
  margin-top: clamp(1.25rem, 2.5vw, 2rem);
  color: var(--ll-text-editorial-muted);
  font-size: clamp(1rem, 1.4vw, 1.15rem);
  line-height: 1.65;
}

body.single-post .hero-section .entry-meta {
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  color: var(--ll-text-editorial-muted);
  letter-spacing: 0.075em;
}

body.single-post .hero-section .entry-meta a {
  color: inherit;
}

/* Reading column and prose rhythm */
body.single-post article.post > .entry-content {
  padding-block: clamp(3rem, 7vw, 6rem);
  color: var(--ll-text-editorial);
  font-size: clamp(1.0625rem, 0.35vw + 1rem, 1.18rem);
  line-height: 1.78;
}

body.single-post .entry-content > :where(
    p,
    h2,
    h3,
    h4,
    h5,
    h6,
    ul,
    ol,
    blockquote,
    details,
    pre,
    hr
  ) {
  box-sizing: border-box;
  width: min(100%, var(--ll-reading-width));
  margin-inline: auto;
}

body.single-post .entry-content > p {
  margin-block: 0 var(--ll-prose-gap);
  text-wrap: pretty;
}

body.single-post .entry-content > p + p {
  margin-top: calc(var(--ll-prose-gap) * 0.35);
}

body.single-post .entry-content > h2 {
  position: relative;
  margin-top: var(--ll-section-gap);
  margin-bottom: var(--ll-heading-gap);
  padding-top: clamp(1.5rem, 3vw, 2.25rem);
  border-top: 1px solid var(--ll-border-editorial);
  color: var(--theme-headings-color, var(--ll-accent-editorial));
  font-size: clamp(1.75rem, 3vw, 2.65rem);
  letter-spacing: -0.022em;
  line-height: 1.15;
  text-wrap: balance;
}

body.single-post .entry-content > h2::before {
  position: absolute;
  top: -1px;
  left: 0;
  width: var(--ll-rule-width);
  height: 2px;
  background: var(--ll-accent-editorial);
  content: "";
}

body.single-post .entry-content > h3 {
  margin-top: clamp(2.75rem, 5vw, 4.5rem);
  margin-bottom: clamp(1rem, 2vw, 1.5rem);
  color: var(--ll-text-editorial);
  font-size: clamp(1.35rem, 2vw, 1.75rem);
  letter-spacing: -0.012em;
  line-height: 1.28;
  text-wrap: balance;
}

body.single-post .entry-content > :where(h2, h3) + p {
  margin-top: 0;
}

body.single-post .entry-content :where(strong, b) {
  color: var(--theme-headings-color, var(--ll-text-editorial));
  font-weight: 700;
}

body.single-post .entry-content :where(em, i) {
  color: color-mix(in srgb, var(--ll-text-editorial) 88%, white);
}

body.single-post .entry-content a {
  color: var(--ll-accent-editorial);
  text-decoration-line: underline;
  text-decoration-color: color-mix(
    in srgb,
    var(--ll-accent-editorial) 62%,
    transparent
  );
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.19em;
  overflow-wrap: anywhere;
}

body.single-post .entry-content a:hover {
  color: var(--theme-headings-color, var(--ll-text-editorial));
  text-decoration-color: currentColor;
}

body.single-post .entry-content :where(a, summary):focus-visible {
  border-radius: 0.15rem;
  outline: 2px solid var(--ll-accent-editorial);
  outline-offset: 4px;
}

/* Lists and editorial primitives */
body.single-post .entry-content > :where(ul, ol) {
  margin-block: clamp(1.5rem, 3vw, 2.25rem);
  padding-left: 1.4em;
}

body.single-post .entry-content :where(ul, ol) li {
  padding-left: 0.35em;
}

body.single-post .entry-content :where(ul, ol) li + li {
  margin-top: 0.65em;
}

body.single-post .entry-content li::marker {
  color: var(--ll-accent-editorial);
  font-weight: 700;
}

body.single-post .entry-content > blockquote {
  margin-block: clamp(2.5rem, 5vw, 4rem);
  padding: 0.35rem 0 0.35rem clamp(1.25rem, 3vw, 2.25rem);
  border-left: 2px solid var(--ll-accent-editorial);
  color: color-mix(in srgb, var(--ll-text-editorial) 88%, white);
  font-size: clamp(1.2rem, 2vw, 1.55rem);
  line-height: 1.55;
}

body.single-post .entry-content > hr {
  height: 1px;
  margin-block: var(--ll-section-gap);
  border: 0;
  background: var(--ll-border-editorial);
}

body.single-post .entry-content mark {
  padding: 0.08em 0.25em;
  background: color-mix(
    in srgb,
    var(--ll-accent-editorial) 28%,
    transparent
  );
  color: var(--ll-text-editorial);
}

body.single-post .entry-content :not(pre) > code {
  padding: 0.12em 0.35em;
  border: 1px solid var(--ll-border-editorial);
  border-radius: 0.2rem;
  background: var(--ll-surface-editorial-raised);
  color: var(--ll-text-editorial);
  font-size: 0.88em;
}

body.single-post .entry-content > pre {
  max-width: 100%;
  margin-block: clamp(2rem, 4vw, 3rem);
  padding: clamp(1rem, 3vw, 1.5rem);
  overflow-x: auto;
  border: 1px solid var(--ll-border-editorial);
  border-radius: 0.25rem;
  background: var(--ll-surface-editorial-raised);
  color: var(--ll-text-editorial);
  line-height: 1.65;
  tab-size: 2;
}

/* Tables: technical plates rather than spreadsheet chrome */
body.single-post .entry-content > figure:has(> table),
body.single-post .entry-content > .wp-block-table {
  box-sizing: border-box;
  width: min(100%, var(--ll-wide-width));
  max-width: var(--ll-wide-width);
  margin-block: clamp(2.5rem, 5vw, 4.5rem);
  margin-inline: auto;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  border: 1px solid var(--ll-border-editorial);
  border-radius: 0.25rem;
  background: var(--ll-surface-editorial-raised);
  box-shadow: inset -1.75rem 0 1.5rem -1.75rem
    color-mix(in srgb, var(--ll-accent-editorial) 52%, transparent);
  scrollbar-color: var(--ll-accent-editorial) var(--ll-surface-editorial-raised);
  scrollbar-width: thin;
}

body.single-post .entry-content table {
  width: 100%;
  min-width: 40rem;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  background: transparent;
  color: var(--ll-text-editorial);
  font-size: clamp(0.86rem, 1.2vw, 0.98rem);
  line-height: 1.45;
}

body.single-post .entry-content table :where(th, td) {
  padding: clamp(0.8rem, 1.7vw, 1.15rem) clamp(0.8rem, 2vw, 1.35rem);
  border: 0;
  border-bottom: 1px solid var(--ll-border-editorial);
  text-align: left;
  vertical-align: top;
}

body.single-post .entry-content table th {
  background: color-mix(
    in srgb,
    var(--ll-accent-editorial) 12%,
    var(--ll-surface-editorial-raised)
  );
  color: var(--theme-headings-color, var(--ll-accent-editorial));
  font-size: 0.78em;
  font-weight: 700;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

body.single-post .entry-content table tbody tr:last-child td {
  border-bottom: 0;
}

body.single-post .entry-content table tbody tr:nth-child(even) td {
  background: color-mix(
    in srgb,
    var(--ll-text-editorial) 3%,
    transparent
  );
}

/* A table note stays coupled to the data plate it qualifies. */
body.single-post .entry-content > figure:has(> table):has(+ .ll-table-note),
body.single-post .entry-content > figure.alignwide:has(+ .ll-figure-note) {
  margin-bottom: clamp(0.65rem, 1.4vw, 1rem);
}

body.single-post .entry-content > :is(.ll-table-note, .ll-figure-note) {
  box-sizing: border-box;
  width: min(100%, var(--ll-wide-width));
  max-width: var(--ll-wide-width);
  margin: 0 auto clamp(2.25rem, 4vw, 3.5rem);
  color: var(--ll-text-editorial-muted);
  font-size: 0.82rem;
  letter-spacing: 0.012em;
  line-height: 1.55;
}

body.single-post .entry-content > :is(.ll-table-note, .ll-figure-note) small {
  font-size: inherit;
}

/* Standard images sit just beyond the reading measure, not on the wide canvas. */
body.single-post .entry-content > figure:has(img):not(.alignwide):not(.alignfull) {
  box-sizing: border-box;
  width: min(100%, var(--ll-figure-width));
  max-width: var(--ll-figure-width);
  margin-block: var(--ll-figure-gap);
  margin-inline: auto;
}

/* Charts, SVGs and timelines opt into the broad editorial canvas explicitly. */
body.single-post .entry-content > :is(figure, .wp-block-image).alignwide {
  box-sizing: border-box;
  width: min(100%, var(--ll-wide-width));
  max-width: var(--ll-wide-width);
  margin-block: var(--ll-wide-figure-gap);
  margin-inline: auto;
}

/* Full-width treatment remains an explicit Gutenberg choice. */
body.single-post .entry-content > :is(figure, .wp-block-image).alignfull {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-inline: auto;
}

/* A non-image figure remains measured until it deliberately receives alignwide. */
body.single-post .entry-content > figure:not(:has(img)):not(:has(> table)):not(.alignwide):not(.alignfull) {
  box-sizing: border-box;
  width: min(100%, var(--ll-reading-width));
  max-width: var(--ll-reading-width);
  margin-block: var(--ll-figure-gap);
  margin-inline: auto;
}

body.single-post .entry-content figure :where(img, svg) {
  display: block;
  max-width: 100%;
  height: auto;
}

body.single-post .entry-content figure > svg[role="img"] {
  width: 100%;
  box-shadow: 0 0 0 1px var(--ll-border-editorial);
}

body.single-post .entry-content figcaption {
  max-width: var(--ll-reading-width);
  margin: 0.85rem auto 0;
  color: var(--ll-text-editorial-muted);
  font-size: 0.78rem;
  letter-spacing: 0.025em;
  line-height: 1.55;
}

/* Editorial grammar: annotations in the reading flow, never dashboard cards. */
:is(body.single-post .entry-content, .editor-styles-wrapper) > :is(
    .is-style-ll-signal,
    .is-style-ll-data,
    .is-style-ll-certainty-observed,
    .is-style-ll-certainty-interpretation,
    .is-style-ll-certainty-hypothesis
  ) {
  box-sizing: border-box;
  width: min(100%, var(--ll-reading-width, 70ch));
  margin-block: clamp(2.5rem, 5vw, 4.25rem);
  margin-inline: auto;
  padding: clamp(1.1rem, 2vw, 1.5rem) 0 clamp(1.1rem, 2vw, 1.5rem)
    clamp(1rem, 2.5vw, 1.75rem);
  border-left: 1px solid var(--ll-note-border, var(--ll-border-editorial, #384b56));
  background: transparent;
}

:is(body.single-post .entry-content, .editor-styles-wrapper)
  :is(
    .is-style-ll-signal,
    .is-style-ll-data,
    .is-style-ll-certainty-observed,
    .is-style-ll-certainty-interpretation,
    .is-style-ll-certainty-hypothesis
  )
  > :where(p, h3) {
  margin-block: 0;
}

:is(body.single-post .entry-content, .editor-styles-wrapper)
  :is(
    .is-style-ll-signal,
    .is-style-ll-data,
    .is-style-ll-certainty-observed,
    .is-style-ll-certainty-interpretation,
    .is-style-ll-certainty-hypothesis
  )
  > :where(p, h3) + :where(p, h3) {
  margin-top: 0.85rem;
}

:is(body.single-post .entry-content, .editor-styles-wrapper) .ll-editorial-label {
  color: var(--ll-note-label, var(--ll-accent-editorial, #84a98c));
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  line-height: 1.3;
  text-transform: uppercase;
}

:is(body.single-post .entry-content, .editor-styles-wrapper) .is-style-ll-signal {
  --ll-note-border: var(--ll-accent-editorial, #84a98c);
  counter-increment: ll-signal;
}

:is(body.single-post .entry-content, .editor-styles-wrapper)
  .is-style-ll-signal
  > .ll-editorial-label::after {
  content: " " counter(ll-signal, decimal-leading-zero);
}

:is(body.single-post .entry-content, .editor-styles-wrapper) .is-style-ll-data {
  padding-inline: 0;
  border-top: 1px solid var(--ll-accent-editorial, #84a98c);
  border-left: 0;
}

:is(body.single-post .entry-content, .editor-styles-wrapper) .ll-data-value {
  color: var(--ll-accent-editorial, #84a98c);
  font-size: clamp(2.5rem, 7vw, 4.75rem);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 1;
}

:is(body.single-post .entry-content, .editor-styles-wrapper)
  .is-style-ll-data
  > .ll-data-statement
  > strong:first-child {
  display: block;
  color: var(--ll-accent-editorial, #84a98c);
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  letter-spacing: -0.025em;
  line-height: 1.18;
}

:is(body.single-post .entry-content, .editor-styles-wrapper) .ll-editorial-source {
  color: var(--ll-text-editorial-muted, #93a39d);
  font-size: 0.78rem;
  line-height: 1.5;
}

:is(body.single-post .entry-content, .editor-styles-wrapper)
  .is-style-ll-certainty-observed {
  --ll-note-border: var(--ll-accent-editorial, #84a98c);
}

:is(body.single-post .entry-content, .editor-styles-wrapper)
  .is-style-ll-certainty-interpretation {
  --ll-note-border: color-mix(
    in srgb,
    var(--ll-accent-editorial, #84a98c) 68%,
    transparent
  );
  border-left-style: dashed;
}

:is(body.single-post .entry-content, .editor-styles-wrapper)
  .is-style-ll-certainty-hypothesis {
  --ll-note-border: color-mix(
    in srgb,
    var(--ll-text-editorial, #cad2c5) 52%,
    transparent
  );
  --ll-note-label: color-mix(
    in srgb,
    var(--ll-accent-editorial, #84a98c) 78%,
    var(--ll-text-editorial, #cad2c5)
  );
  border-left-style: dotted;
}

/* Native disclosure as a laboratory appendix. */
body.single-post .entry-content > details {
  margin-block: clamp(2.5rem, 5vw, 4rem);
  padding-block: 1.1rem;
  border-top: 1px solid var(--ll-border-editorial);
  border-bottom: 1px solid var(--ll-border-editorial);
  background: transparent;
  color: var(--ll-text-editorial);
}

body.single-post .entry-content details > summary {
  color: var(--theme-headings-color, var(--ll-accent-editorial));
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  cursor: pointer;
}

body.single-post .entry-content details > summary::marker {
  color: var(--ll-accent-editorial);
}

body.single-post .entry-content details[open] > summary {
  margin-bottom: 1.1rem;
}

body.single-post .entry-content details > :not(summary) {
  max-width: var(--ll-reading-width);
}

/* Complementary sources are available without competing with the argument. */
body.single-post .entry-content > .ll-sources-details {
  margin-block: clamp(2rem, 4vw, 3.25rem);
}

body.single-post .entry-content .ll-sources-details__content > p {
  margin: 0;
  color: var(--ll-text-editorial-muted);
  font-size: 0.82rem;
  line-height: 1.6;
}

body.single-post .entry-content .ll-sources-details__content small {
  font-size: inherit;
}

/* Long methodology attached to a wide visual remains one quiet disclosure. */
body.single-post .entry-content > figure:has(> table):has(+ .ll-visual-methodology) {
  margin-bottom: clamp(0.65rem, 1.4vw, 1rem);
}

body.single-post .entry-content > .ll-visual-methodology {
  box-sizing: border-box;
  width: min(100%, var(--ll-wide-width));
  max-width: var(--ll-wide-width);
  margin-top: 0;
  margin-bottom: clamp(2.25rem, 4vw, 3.5rem);
}

body.single-post .entry-content > .ll-visual-methodology .ll-sources-details__content > p:first-child {
  font-size: 0.9rem;
  line-height: 1.62;
}

body.single-post .entry-content > .ll-visual-methodology .ll-sources-details__content > p + p {
  margin-top: 0.8rem;
}

/* The table of contents is a light reading instrument, not a sidebar card. */
body.single-post .entry-content > .ll-article-toc {
  box-sizing: border-box;
  width: min(100%, var(--ll-figure-width));
  margin: clamp(3rem, 6vw, 4.75rem) auto 0;
  padding-block: 1.1rem 1.35rem;
  border-top: 1px solid var(--ll-border-editorial);
  border-bottom: 1px solid var(--ll-border-editorial);
}

body.single-post .entry-content > .ll-article-toc + h2 {
  margin-top: clamp(2.75rem, 5vw, 4rem);
}

body.single-post .entry-content .ll-article-toc > summary {
  color: var(--theme-headings-color, var(--ll-accent-editorial));
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

body.single-post .entry-content .ll-article-toc nav {
  margin-top: 1.2rem;
}

body.single-post .entry-content .ll-article-toc ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

body.single-post .entry-content .ll-article-toc li {
  padding-left: 0.85rem;
  border-left: 1px solid transparent;
}

body.single-post .entry-content .ll-article-toc li + li {
  margin-top: 0.55rem;
}

body.single-post .entry-content .ll-article-toc a {
  color: var(--ll-text-editorial-muted);
  font-size: 0.96rem;
  line-height: 1.45;
  text-decoration-color: transparent;
}

body.single-post .entry-content .ll-article-toc a:hover,
body.single-post .entry-content .ll-article-toc a.is-active {
  color: var(--theme-headings-color, var(--ll-accent-editorial));
  text-decoration-color: currentColor;
}

body.single-post .entry-content .ll-article-toc li:has(a.is-active) {
  border-left-color: var(--ll-accent-editorial);
}

body.single-post .entry-content > h2[id] {
  scroll-margin-top: clamp(5.5rem, 10vw, 8rem);
}

/* End matter belongs to the same measured editorial canvas. */
body.single-post article.post > .ct-share-box {
  padding-block: clamp(2rem, 5vw, 4rem);
  border-top: 1px solid var(--ll-border-editorial);
}

@media (max-width: 48rem) {
  body.single-post {
    --ll-page-gutter: clamp(1rem, 5vw, 1.5rem);
    --ll-section-gap: clamp(3.5rem, 14vw, 5rem);
  }

  body.single-post article.post > .hero-section {
    padding-block: clamp(2.5rem, 11vw, 3.75rem) clamp(2.25rem, 8vw, 3rem);
  }

  body.single-post .hero-section .page-title {
    max-width: 100%;
    font-size: clamp(2.05rem, 10vw, 3.25rem);
    line-height: 1.06;
    text-wrap: pretty;
  }

  body.single-post article.post > .entry-content {
    font-size: clamp(1rem, 4.4vw, 1.1rem);
    line-height: 1.72;
  }

  body.single-post .entry-content table {
    min-width: 36rem;
  }

  body.single-post .entry-content table :where(th, td) {
    padding: 0.8rem;
  }
}

@media (max-width: 48.875rem) {
  body.single-post.admin-bar .ll-reading-progress {
    top: 46px;
  }
}

@media (max-width: 22.5rem) {
  body.single-post {
    --ll-page-gutter: 0.875rem;
  }

  body.single-post .hero-section .page-title {
    font-size: 1.95rem;
  }

  body.single-post .entry-content > h2 {
    font-size: 1.65rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.single-post .ll-reading-progress__value {
    transition: none;
  }
}