/* Shared palette for every public newspaper page; the OS preference selects the theme. */
:root {
    color-scheme: light;
    --paper: #faf9f5;
    --surface: #f1efe8;
    --masthead-background: var(--paper);
    --nav-background: var(--paper);
    --ink: #20231f;
    --muted: #62645d;
    --secondary-text: #50534d;
    --rule: #c9c8be;
    --strong-rule: #686b63;
    --link: #643c32;
    --accent: #7a302b;
}
@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;
        --paper: #232522;
        --surface: #30332e;
        --ink: #e2e0d7;
        --muted: #b6b8ad;
        --secondary-text: #c7c9be;
        --rule: #51564d;
        --strong-rule: #818779;
        --link: #dcb8a2;
        --accent: #e5ab94;
    }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Georgia, 'Times New Roman', serif; }
a { color: var(--link); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .16em; }
.masthead { background: var(--masthead-background); }
.nameplate, .nameplate a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: .16em; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.paper { max-width: 1280px; margin: auto; padding: 0 36px; }
.skip-link { position: absolute; left: 16px; top: -100px; background: var(--surface); padding: 12px; z-index: 2; }
.skip-link:focus { top: 12px; }
.edition { display: flex; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid var(--rule); font: .72rem/1.4 Arial, sans-serif; color: var(--muted); }
.nameplate { display: block; text-align: center; margin: 0; padding: 26px 0 22px; font-size: clamp(2rem, 5.5vw, 4.75rem); line-height: 1.06; font-weight: bold; letter-spacing: -.055em; }
.masthead nav { background: var(--nav-background); border-top: 3px solid var(--strong-rule); border-bottom: 1px solid var(--strong-rule); display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; padding: 12px 0; font: bold .8rem/1.4 Arial, sans-serif; }
.front-page { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 32px; padding: 32px 0; }
.lead-story { max-width: 850px; }
.front-page:not(:has(.latest-stories)) { grid-template-columns: 1fr; }
.kicker { margin: 0 0 12px; color: var(--accent); text-transform: uppercase; letter-spacing: .09em; font: bold .75rem/1.4 Arial, sans-serif; }
.lead-story h2 { font-size: clamp(2.2rem, 4vw, 3.65rem); line-height: 1.07; letter-spacing: -.035em; margin: 0 0 18px; }
.deck { color: var(--secondary-text); font-size: 1.3rem; line-height: 1.5; margin: 0 0 22px; }
.metadata { display: flex; flex-wrap: wrap; gap: 6px 14px; color: var(--muted); font: .72rem/1.5 Arial, sans-serif; }
.metadata span { font-weight: bold; color: var(--ink); }
.latest-stories { border-left: 1px solid var(--rule); padding-left: 26px; }
.section-heading { margin: 0 0 16px; font: bold .9rem/1.3 Arial, sans-serif; letter-spacing: .035em; }
.brief { padding: 15px 0; border-top: 1px solid var(--rule); }
.brief h3 { margin: 0 0 10px; font-size: 1.4rem; line-height: 1.2; }
.section-block { border-top: 2px solid var(--strong-rule); padding: 18px 0 28px; scroll-margin-top: 20px; }
.story-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.section-story { padding-right: 22px; border-right: 1px solid var(--rule); }
.section-story:nth-child(3n) { border-right: 0; padding-right: 0; }
.section-story h3 { margin: 0 0 10px; font-size: 1.6rem; line-height: 1.15; letter-spacing: -.015em; }
.section-story > p:not(.metadata) { line-height: 1.5; color: var(--secondary-text); margin: 0 0 16px; }
.article-page { max-width: 900px; margin: 38px auto 64px; }
.article-header { border-bottom: 1px solid var(--rule); padding-bottom: 18px; }
.article-header h1 { font-size: clamp(2.3rem, 4.5vw, 4rem); line-height: 1.08; letter-spacing: -.035em; margin: 0 0 22px; }
.article-body { max-width: 680px; font-size: 1.2rem; line-height: 1.8; margin-top: 30px; overflow-wrap: anywhere; }
.article-body p { margin: 0 0 1.35em; }
h1, h2, h3, .deck { overflow-wrap: anywhere; }
.back-link { border-top: 1px solid var(--rule); padding-top: 20px; margin-top: 40px; font: .8rem Arial, sans-serif; }
.footer { border-top: 3px double var(--strong-rule); padding: 22px 0 32px; display: flex; justify-content: space-between; gap: 20px; font-size: .85rem; }
.empty-edition { padding: 48px 0; }
@media (max-width: 800px) {
    .paper { padding: 0 20px; }
    .front-page { grid-template-columns: 1fr; gap: 24px; }
    .latest-stories { border-left: 0; border-top: 1px solid var(--strong-rule); padding: 18px 0 0; }
    .story-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .section-story, .section-story:nth-child(3n) { border-right: 0; padding-right: 0; }
}
@media (max-width: 520px) {
    .paper { padding: 0 16px; }
    .edition { font-size: .65rem; }
    .nameplate { padding: 22px 0; }
    .masthead nav { justify-content: flex-start; gap: 10px 20px; }
    .story-columns { grid-template-columns: 1fr; }
    .section-story + .section-story { border-top: 1px solid var(--rule); padding-top: 18px; }
    .article-body { font-size: 1.1rem; line-height: 1.7; }
    .deck { font-size: 1.15rem; }
}
