/* Loaded only in 2027 mode. Font files are self-hosted through Fonts.css. */
:root {
    --code-color-heading: #202124;
    --code-color-action: #f4a60c;
    --code-color-action-hover: #fbbf24;

    --code-font-ui: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    --code-font-heading: var(--code-font-ui);
    --code-font-body: var(--code-font-ui);
    --code-font-editorial: "Source Serif 4", Georgia, "Times New Roman", serif;
    --code-font-code: "Fira Code", Consolas, Monaco, monospace;

    --code-font-article-heading: var(--code-font-editorial);
    --code-font-article-body: var(--code-font-editorial);
    --code-font-blog-ui: var(--code-font-ui);
    --code-font-form: var(--code-font-ui);

    --code-font-weight-regular: 400;
    --code-font-weight-medium: 500;
    --code-font-weight-semibold: 600;
    --code-font-weight-bold: 700;

    --code-font-size-body: .9166666667rem; /* Existing 11pt baseline. */
    --code-font-size-small: .875rem;
    --code-font-size-content: 1.125rem;
    --code-font-size-lead: clamp(1.25rem, 2vw, 1.5rem);
    --code-font-size-page-title: 2.25rem;
    --code-font-size-section-title: 2rem;
    --code-font-size-subsection-title: 1.6666666667rem;
    --code-font-size-hero-title: clamp(2.25rem, 4vw, 4rem);

    --code-line-height-heading: 1.25;
    --code-line-height-hero: 1.1;
    --code-line-height-lead: 1.5;
    --code-line-height-reading: 1.7;
    --code-line-height-paragraph: 1.5rem; /* Preserve current paragraph rhythm. */
}

/* Editorial families stay inside reading content; metadata and controls use UI. */
.magazine-article .article-body :is(h1, h2, h3, h4, h5, h6) {
    font-family: var(--code-font-article-heading);
}

.blog-post {
    font-family: var(--code-font-editorial);
}

.blog-post .blog-metadata,
.magazine-article :is(.author-by-line, .copy-button, .more-button, .less-button) {
    font-family: var(--code-font-ui);
}

pre, code, kbd, samp {
    font-family: var(--code-font-code);
}