/* Bits — the one page set in monospace. The shared system (style.css)
   provides the tokens, nav, footer, and hero; this file swaps the type
   for the hero, the stream, and the pager, and re-tunes the sizes and
   spacing that a fixed-width face throws off.

   Berkeley Mono first for anyone who owns it, Geist Mono (Google Fonts,
   OFL) as the face everyone else gets. */

:root {
    --bits-mono: 'Berkeley Mono', 'Geist Mono', ui-monospace, SFMono-Regular,
                 Menlo, Monaco, monospace;
}

/* ---- Hero ---- */

/* Mono runs wide, so the masthead loses the serif's negative tracking and
   gives back the width the fixed advance takes. */
.masthead {
    font-family: var(--bits-mono);
    font-weight: 300;
    font-size: clamp(3.4rem, 13vw, 8rem);
    letter-spacing: -0.02em;
}

.lede {
    font-family: var(--bits-mono);
    /* A fixed-width face reads larger at the same size; step it down and
       hold the line length near 68 characters. */
    font-size: clamp(0.95rem, 1.25vw, 1.05rem);
    line-height: 1.75;
    max-width: 42em;
}

.count-line {
    font-family: var(--bits-mono);
    letter-spacing: 0.1em;
}

/* ---- Stream ---- */

/* 44em of mono is ~73 characters — a shade wide for a bit, so pull the
   column in until it measures like the serif version did. */
.stream {
    max-width: 40em;
}

.bit-content {
    font-family: var(--bits-mono);
    font-size: clamp(0.95rem, 1.2vw, 1rem);
    line-height: 1.75;
}

/* Inline code no longer contrasts by shape, so it leans on the plate. */
.bit-content code {
    font-family: inherit;
    font-size: 1em;
}

.bit-content pre {
    font-size: 0.95em;
}

.bit-content blockquote {
    /* Mono italics are a synthetic slant at best; the rule and the muted
       color carry the quote instead. */
    font-style: normal;
}

.bit-content cite,
.bit-date {
    font-family: var(--bits-mono);
    font-size: 0.8125rem;
}

.bit:not(:last-child)::after {
    letter-spacing: 0.2em;
}

/* ---- Pager ---- */

.pager {
    font-family: var(--bits-mono);
    font-size: 0.8125rem;
}
