/* Kodros blog (2026-11-04): the index list and the post parts that only the blog has.
   Layout, type, the reading rail and the close come from story.css. Posts are built by scripts/build-blog.mjs. */

.st-head__title em{font-style:italic;color:var(--st-gold-ink)}
.st-head--post .st-head__title{max-width:16em;font-size:clamp(2.4rem,1.5rem + 3.2vw,4.4rem)}
.st-head--post .st-head__lede{max-width:40rem;text-align:left}

/* The index: one quiet list, newest first, each title in the display serif. */
.st-posts{max-width:52rem;margin:0 auto;padding:0;list-style:none;border-bottom:1px solid var(--st-rule)}
.st-posts > li{display:grid;gap:8px;padding:32px 0;border-top:1px solid var(--st-rule)}
.st-posts__meta{margin:0;font:600 var(--t-2xs)/16px var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--st-gold-ink)}
.st-posts__name{font:500 clamp(1.625rem,1.3rem + 1.1vw,2.25rem)/1.12 var(--mk-serif);letter-spacing:-.012em;color:var(--st-ink);text-decoration:none;text-wrap:balance}
.st-posts__name:hover{text-decoration:underline;text-decoration-color:var(--st-gold);text-decoration-thickness:1px;text-underline-offset:.18em}
.st-posts > li > p:last-child{max-width:40em;margin:0;font:400 var(--t-md)/1.65 var(--font-ui);color:var(--st-ink-2)}
.st-posts--compact{margin:0}
.st-posts--compact > li{padding:20px 0}
.st-posts--compact .st-posts__name{font-size:clamp(1.375rem,1.2rem + .6vw,1.75rem)}

/* Post parts. */
.blog-page .cite{font:600 .72em/1 var(--font-ui);vertical-align:super;text-decoration:none;color:var(--st-gold-ink)}
.blog-page .callout{margin:28px 0;padding:18px 22px;border:1px solid var(--st-gold-soft);border-radius:var(--mk-r-card);background:var(--st-card)}
.blog-page .callout__label{display:block;margin:0 0 6px;font:600 var(--t-2xs)/16px var(--font-ui);letter-spacing:.12em;text-transform:uppercase;color:var(--st-gold-ink)}
.blog-page .callout p{margin:0}
.guide-table{margin:24px 0;overflow-x:auto}
.guide-table table{min-width:32rem}
.guide-sources{padding-left:1.4em;font-size:var(--t-sm)}
.guide-sources li:target{background:var(--st-gold-soft)}
.blog-page .steps{counter-reset:step;margin:20px 0;padding:0;list-style:none}
.blog-page .steps > li{counter-increment:step;display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;padding:14px 0;border-top:1px solid var(--st-rule)}
.blog-page .steps > li::before{content:counter(step);font:500 1.375rem/1.2 var(--mk-serif);color:var(--st-gold-ink)}
.blog-page .steps > li > *{grid-column:2;margin:0}
.blog-page .faq{margin:0;border-top:1px solid var(--st-rule)}
.blog-page .faq details{border-bottom:1px solid var(--st-rule)}
.blog-page .faq summary{padding:18px 40px 18px 0;font:500 1.25rem/1.3 var(--mk-serif);color:var(--st-ink);cursor:pointer}
.blog-page .faq details > div{padding:0 0 18px}
.guide-next{margin-top:56px;padding:28px;border:1px solid var(--st-gold-soft);border-radius:var(--mk-r-card);background:var(--st-cloud)}
.st-read__body .guide-next h2{margin-top:0;padding-top:0;border-top:0}
.guide-next .actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:20px}