:root{
  --paper:#FAF8F2; --ink:#1F2A30; --muted:#5E6A69; --line:#E0E0D6;
  --accent:#A8462A;
  --serif:"Source Serif 4",Georgia,"Times New Roman",serif;
  --display:"Fraunces","Source Serif 4",Georgia,serif;
  --sans:"IBM Plex Sans",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root{
    --paper:#141917; --ink:#E8EAE6; --muted:#A3AAA6; --line:#2F3633;
    --accent:#F08A62;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:18px/1.7 var(--serif)}
img{max-width:100%;height:auto;display:block}
a{color:var(--ink);text-underline-offset:3px;text-decoration-thickness:1px}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* Masthead */
.masthead{border-bottom:1px solid var(--line)}
.masthead-inner{max-width:1120px;margin:0 auto;padding:44px 20px 30px}
.masthead h1{margin:0 0 14px;line-height:0}
.masthead h1 a,.masthead h1 picture{display:block;width:fit-content}
.masthead h1 img{width:clamp(200px,26vw,300px);height:auto}
.tagline{margin:0;font-style:italic;font-size:clamp(18px,1.9vw,21px);line-height:1.5;color:var(--muted);max-width:34em;text-wrap:pretty}

main{padding-inline:20px}
.wrap{max-width:1080px;margin:0 auto}

/* Shared story parts. Each story sets --story (its site's accent) and --story-dark inline. */
.kicker{font:600 12.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}
.story h2 a,.story h3 a{color:inherit;text-decoration:none}
.story h2 a:hover,.story h3 a:hover{text-decoration:underline;text-decoration-thickness:2px}
.story-img{display:block}
.story-img img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:2px}
.dek{margin:0;font-style:italic;line-height:1.5;color:var(--muted);text-wrap:pretty}
.byline{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font:14px/1.4 var(--sans);color:var(--muted)}
.source{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--story)}
.source img{width:auto;height:22px}

/* Lead story: the newest one */
.lead{padding-top:36px}
.lead-body{display:flex;flex-wrap:wrap;gap:0 48px;margin-top:26px;align-items:flex-start}
.lead-title{flex:3 1 420px;min-width:0}
.lead h2{margin:0;font-family:var(--display);font-weight:600;font-optical-sizing:auto;font-size:clamp(32px,3.9vw,48px);line-height:1.08;letter-spacing:-.01em;text-wrap:balance}
.lead-text{flex:2 1 300px;min-width:0;padding-top:26px;display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.lead .dek{font-size:clamp(18px,1.6vw,20px)}
.btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 20px;border-radius:3px;background:var(--story);color:#FFFFFF;font:600 15px/1 var(--sans);text-decoration:none}
.btn:hover{filter:brightness(1.08)}
.btn svg{flex:none}

/* Earlier stories */
.earlier{margin-top:72px}
.section-label{margin:0;padding-top:14px;border-top:2px solid var(--ink);font:600 13px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.feed{list-style:none;margin:0;padding:0}
.feed > li{border-bottom:1px solid var(--line)}
.row{display:flex;flex-wrap:wrap;gap:18px 36px;align-items:flex-start;padding:28px 0}
.row .story-img{flex:1 1 300px;min-width:0}
.row-text{flex:999 1 420px;min-width:0}
.row .kicker{margin-bottom:12px}
.row h3{margin:0 0 10px;font-family:var(--display);font-weight:600;font-optical-sizing:auto;font-size:clamp(24px,2.3vw,29px);line-height:1.18;text-wrap:balance}
.row .dek{font-size:17.5px;max-width:38em;margin-bottom:14px}

footer{border-top:1px solid var(--line);margin-top:64px}
.foot-inner{max-width:1120px;margin:0 auto;padding:22px 20px 40px;font:13.5px/1.5 var(--sans);color:var(--muted)}
.foot-inner p{margin:0 0 6px}

@media (prefers-color-scheme: dark){
  .source{color:var(--story-dark)}
  .btn{background:var(--story-dark);color:var(--paper)}
}