/* Blog-only overrides. Loaded after site.css.
   Keep this file hand-written: assets/site.css is generated from index.html
   and will be overwritten whenever the homepage styles are re-extracted. */

/* The homepage's mobile touch-target rule sets `display: flex; min-height: 44px`
   on EVERY <a>. That is right for nav items and buttons, but it turns a link
   inside a sentence into its own 44px-tall block, pushing following punctuation
   onto a new line. The homepage never shows this because it has no prose links.
   Long-form articles do, so restore inline flow for links inside article text. */
@media (max-width: 768px) {
    article p a,
    article li a,
    article figcaption a,
    .prose-inline a {
        display: inline;
        min-height: 0;
        align-items: normal;
    }
}

/* Comfortable long-form reading rhythm. The homepage is a landing page and
   never sets these, so they only apply here. */
article p {
    line-height: 1.75;
}

article ul li {
    line-height: 1.7;
}

/* Images in articles should never overflow their measure. */
article img {
    max-width: 100%;
    height: auto;
}