/* Listing-only: native details work before hydration and without JavaScript. */
main.page.blog-listing{padding-top:28px}
.blog-listing .xt-breadcrumbs{margin:0 0 20px;padding:0}
.blog-listing h1{margin:0 0 20px;overflow-wrap:anywhere;scroll-margin-top:90px}
.blog-listing .blog-tax--compact{display:flex;align-items:flex-start;gap:10px;margin:0 0 24px;flex-wrap:wrap;font-size:15px;line-height:1.5}
.blog-tax--compact details{min-width:0;max-width:100%;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink)}
.blog-tax--compact summary{cursor:pointer;min-height:44px;padding:10px 14px;box-sizing:border-box;overflow-wrap:anywhere}
.blog-tax--compact summary strong{font-weight:600}
.blog-tax--compact details[open]{flex-basis:100%}
.blog-tax--compact .blog-tax__options{display:flex;flex-wrap:wrap;gap:8px;padding:0 12px 12px}
.blog-tax--compact .blog-chip{display:inline-flex;align-items:center;min-height:44px;box-sizing:border-box;max-width:100%;overflow-wrap:anywhere;text-decoration:none;padding:8px 12px}
.blog-tax--compact .blog-chip.is-active{background:var(--surface);font-weight:600}
.blog-tax--compact .blog-tax__reset{display:inline-flex;align-items:center;min-height:44px;padding:8px 4px;box-sizing:border-box}
.blog-tax--compact :is(summary,a):focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.blog-listing .runtime-post-grid{margin-top:0}
.blog-listing .runtime-post-grid article{margin-top:0}
/* Headline links retain native anchors, contrast and an explicit link cue. */
.blog-listing .post-card > a:has(> h3){color:var(--ink);text-decoration:none}
.blog-listing .post-card > a > h3::after{content:' ↗';white-space:nowrap;font-size:.75em}
.blog-listing .post-card > a:has(> h3):hover,.blog-listing .post-card > a:has(> h3):focus-visible{text-decoration:underline;text-underline-offset:4px}
.blog-listing .post-card > a:has(> h3):focus-visible{outline:2px solid var(--focus);outline-offset:3px}
@media(max-width:700px){
 main.page.blog-listing{padding-top:24px}
 .blog-listing .xt-breadcrumbs{margin-bottom:16px}
 .blog-listing h1{font-size:34px;margin-bottom:18px}
 .blog-listing .blog-tax--compact{gap:8px;margin-bottom:24px}
 .blog-tax--compact .blog-tax__categories{flex-basis:100%}
}