/* entry-detail — the detail page for ONE row of a live feed. Flush. The entry
 * IS an l-register lockup (see the row partial), so voice, beat, measure, and
 * rhythm all come from the lockup system; this sheet owns only what the
 * SECTION contributes: the reading column, the cover's placement axis, the
 * prose rhythm, the facts list, and the prev/next row. */

/* The reading column. Prose rides the theme's own measure so a detail page
 * never sets its own line length. */
.sk-entry-detail-entry,
.sk-entry-detail-missing,
.sk-entry-detail-facts,
.sk-entry-detail-actions {
  max-width: var(--sk-measure);
}

.sk-entry-detail-back {
  display: inline-block;
  margin-bottom: var(--sk-band-pad);
  font-size: var(--sk-text-detail-size);
}

/* The meta line is the kit's DETAIL label voice; only the tag takes the
 * accent (the shared row-meta grammar blog-list established). */
.sk-entry-detail-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--kit-space-2);
}
.sk-entry-detail-tag {
  color: var(--sk-accent);
}
.sk-entry-detail-author {
  color: var(--sk-ink-muted);
}

/* The lede — one step over body, the shared knob (never a hand-rolled clamp). */
.sk-entry-detail-lede {
  font-size: var(--sk-lede-size);
}

/* ── The COVER placement axis (data-cover on the section root) ──────────────
 * The cover lives in the ROW partial (it is row data), so WHERE it sits is
 * decided here, from the section's own axis: the entry is a flex column and
 * the axis only reorders it. `below` is the editorial default (title block
 * first), `above` puts the object first (the product-page posture), `none`
 * suppresses it for a text-only detail. */
.sk-entry-detail-entry {
  display: flex;
  flex-direction: column;
  gap: var(--kit-space-4);
}
.sk-entry-detail-cover {
  width: 100%;
  height: auto;
  border-radius: var(--sk-media-radius);
  filter: var(--sk-image-filter, none);
}
.sk-entry-detail[data-cover="above"] .sk-entry-detail-cover {
  order: -1;
}
.sk-entry-detail[data-cover="none"] .sk-entry-detail-cover {
  display: none;
}

/* The prose body: the feed's own render-ready fragment, so the rhythm is set
 * on its CHILDREN rather than on authored classes we don't control. */
.sk-entry-detail-body > * + * {
  margin-top: var(--kit-space-4);
}
.sk-entry-detail-body :is(h2, h3) {
  font-family: var(--kit-font-title);
  font-weight: var(--kit-weight-title);
  line-height: var(--kit-lead-title);
  margin-top: var(--sk-band-pad);
}
.sk-entry-detail-body :is(ul, ol) {
  padding-inline-start: var(--kit-space-4);
}
.sk-entry-detail-body blockquote {
  margin: 0;
  padding-inline-start: var(--kit-space-4);
  border-inline-start: var(--sk-border-width) solid var(--sk-accent);
  color: var(--sk-ink-muted);
}
.sk-entry-detail-body img {
  max-width: 100%;
  height: auto;
}

/* The FACTS list — a product's specs, a project's credits. Hairline rows,
 * the shared ruled vocabulary. */
.sk-entry-detail-facts {
  margin-top: var(--sk-band-pad);
}
.sk-entry-detail-fact-list {
  margin: 0;
  /* Specs/credits are DATA rows — the tighter of the two air dials. */
  --sk-ruled-pad: var(--sk-data-row-pad);
}
.sk-entry-detail-fact {
  display: flex;
  justify-content: space-between;
  gap: var(--kit-space-4);
  font-size: var(--sk-text-detail-size);
}
.sk-entry-detail-fact dt {
  color: var(--sk-ink-muted);
}
.sk-entry-detail-fact dd {
  margin: 0;
  text-align: right;
}

.sk-entry-detail-actions {
  margin-top: var(--sk-band-pad);
}

/* Prev/next — the feed's sequence, when the rows carry neighbours. */
.sk-entry-detail-nav {
  display: flex;
  justify-content: space-between;
  gap: var(--kit-space-4);
  margin-top: var(--sk-band-pad);
  padding-top: var(--sk-ruled-pad);
  border-top: var(--sk-border-width) solid var(--sk-stroke);
}
.sk-entry-detail-nav .sk-detail {
  display: block;
  color: var(--sk-ink-muted);
}
.sk-entry-detail-next {
  text-align: right;
}