:root{
  --paper:#fbfaf7;
  --white:#ffffff;
  --ink:#16191b;
  --ink-soft:#4d5559;
  --ink-mute:#6b7377;
  --rule:#dcd7cd;
  --rule-strong:#16191b;
  --accent:#1f5f63;
  --accent-dark:#164548;
  --flag:#a3271f;
  --serif:"Source Serif 4", Georgia, "Times New Roman", serif;
  --sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --wrap:72rem;
  --col:40rem;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:19px;line-height:1.65;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 1.25rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.5rem 1rem;font-family:var(--sans);font-size:.9rem;z-index:100}
.skip:focus{left:1rem;top:1rem}

/* Masthead */
.topbar{border-bottom:1px solid var(--rule);font-family:var(--sans);font-size:.78rem;color:var(--ink-soft)}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;min-height:36px;gap:1rem}
.topbar a{color:var(--ink);font-weight:600;text-decoration:none}
.topbar a:hover{text-decoration:underline}
.masthead{text-align:center;padding:1.4rem 0 1rem}
.brand{font-family:var(--serif);font-weight:800;font-size:clamp(2.1rem,6vw,3.4rem);letter-spacing:-.02em;line-height:1;color:var(--ink);text-decoration:none}
.tagline{font-family:var(--serif);font-style:italic;font-size:.95rem;color:var(--ink-soft);margin:.45rem 0 0}
.site-nav{position:sticky;top:0;z-index:40;background:var(--paper);border-top:3px double var(--rule-strong);border-bottom:1px solid var(--rule-strong)}
.site-nav ul{list-style:none;margin:0 auto;padding:0 1.25rem;display:flex;justify-content:center;gap:.25rem;max-width:var(--wrap);overflow-x:auto;scrollbar-width:none}
.site-nav ul::-webkit-scrollbar{display:none}
.site-nav a{display:block;padding:.75rem 1rem;font-family:var(--sans);font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);text-decoration:none;white-space:nowrap;border-bottom:3px solid transparent;margin-bottom:-1px}
.site-nav a:hover,.site-nav a[aria-current="true"]{border-bottom-color:var(--accent);color:var(--accent)}

/* Layout */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 19rem;gap:3.5rem;padding-top:2.5rem}
.sidebar{border-left:1px solid var(--rule);padding-left:2rem}
.sidebar-inner{position:sticky;top:4.5rem}

/* Article */
.rubric{display:inline-block;font-family:var(--sans);font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);text-decoration:none;margin:0 0 .8rem}
.rubric .sep{color:var(--ink-mute);font-weight:500;margin:0 .35rem}
.rubric .place{color:var(--ink-soft);font-weight:600}
.article h1{font-family:var(--serif);font-weight:700;font-size:clamp(2rem,4.6vw,3.15rem);line-height:1.08;letter-spacing:-.018em;margin:0 0 1rem;max-width:22ch}
.standfirst{font-size:1.25rem;line-height:1.5;color:var(--ink-soft);margin:0 0 1.4rem;max-width:var(--col)}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem 1rem;font-family:var(--sans);font-size:.85rem;color:var(--ink-soft);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:.7rem 0;margin:0 0 1.75rem}
.meta strong{color:var(--ink);font-weight:600}
.meta .dot{color:var(--rule)}
.hero{margin:0 0 2rem}
.hero svg{width:100%;height:auto;border-radius:3px;background:#dfe8e7}
figcaption{font-family:var(--sans);font-size:.8rem;line-height:1.45;color:var(--ink-mute);margin-top:.55rem}
.body{max-width:var(--col)}
.body p{margin:0 0 1.15rem}
.body p:first-child::first-letter{float:left;font-weight:700;font-size:3.9rem;line-height:.85;padding:.38rem .5rem 0 0;color:var(--ink)}
.pullquote{margin:2rem 0;padding:1.1rem 0;border-top:1px solid var(--rule-strong);border-bottom:1px solid var(--rule);font-size:1.45rem;line-height:1.35;font-style:italic}
.pullquote p{margin:0}
.pullquote cite{display:block;margin-top:.6rem;font-family:var(--sans);font-style:normal;font-size:.8rem;color:var(--ink-soft)}
.article-foot{max-width:var(--col);font-family:var(--sans);font-size:.82rem;color:var(--ink-mute);border-top:1px solid var(--rule);padding-top:1rem;margin-top:2rem}

/* Newsletter */
.newsletter{background:var(--white);border:1px solid var(--rule);border-top:4px solid var(--accent);padding:2rem;margin:3rem 0 0}
.newsletter .eyebrow{font-family:var(--sans);font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin:0 0 .4rem}
.newsletter h2{font-family:var(--serif);font-size:clamp(1.45rem,3vw,1.85rem);line-height:1.15;margin:0 0 .5rem}
.newsletter .intro{font-size:1rem;line-height:1.5;color:var(--ink-soft);margin:0 0 1.2rem}
.nl-row{display:flex;gap:.6rem}
.nl-row input[type=email]{flex:1;min-width:0;min-height:48px;padding:0 .9rem;font-family:var(--sans);font-size:1rem;color:var(--ink);background:var(--paper);border:1.5px solid #b9b3a7;border-radius:6px}
.nl-row input[type=email]:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 1.5rem;border:0;border-radius:6px;background:var(--accent);color:#fff;font-family:var(--sans);font-size:1rem;font-weight:600;cursor:pointer;transition:background-color .15s}
.btn:hover{background:var(--accent-dark)}
.consent{display:flex;gap:.6rem;align-items:flex-start;margin:.9rem 0 0;font-family:var(--sans);font-size:.82rem;line-height:1.45;color:var(--ink-soft)}
.consent input{margin:.15rem 0 0;width:1.05rem;height:1.05rem;flex:none;accent-color:var(--accent)}
.fine{font-family:var(--sans);font-size:.75rem;color:var(--ink-mute);margin:.6rem 0 0}
.nl-error{font-family:var(--sans);font-size:.8rem;color:var(--flag);margin:.5rem 0 0;min-height:0}
.nl-error:empty{display:none}
.nl-success{display:none;font-family:var(--serif);font-size:1.25rem;font-weight:600;color:var(--accent);margin:0;padding:.6rem 0}
.is-done form{display:none}
.is-done .nl-success{display:block}
.newsletter.compact{padding:1.25rem;margin:0 0 2rem}
.newsletter.compact h2{font-size:1.25rem}
.newsletter.compact .nl-row{flex-direction:column}
.newsletter.compact .btn{width:100%}

/* Sidebar list */
.side-h{font-family:var(--sans);font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin:0 0 .6rem;padding-bottom:.4rem;border-bottom:1px solid var(--rule-strong)}
.trending{list-style:none;margin:0;padding:0;counter-reset:t}
.trending li{counter-increment:t;display:grid;grid-template-columns:1.8rem 1fr;gap:.2rem;padding:.75rem 0;border-bottom:1px solid var(--rule)}
.trending li::before{content:counter(t);font-family:var(--serif);font-size:1.4rem;font-weight:700;line-height:1;color:var(--accent)}
.trending a{font-family:var(--serif);font-size:1rem;line-height:1.3;font-weight:600;color:var(--ink);text-decoration:none}
.trending a:hover{text-decoration:underline}

/* More stories */
.more{margin-top:4rem;padding-top:1.25rem;border-top:3px double var(--rule-strong)}
.more-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.75rem 1.5rem;margin-bottom:1.75rem}
.more-head h2{font-family:var(--serif);font-size:clamp(1.6rem,3.4vw,2.1rem);margin:0;letter-spacing:-.01em}
.more-head p{margin:.2rem 0 0;font-size:1rem;color:var(--ink-soft)}
.filters{display:flex;flex-wrap:wrap;gap:.4rem}
.filters button{font-family:var(--sans);font-size:.78rem;font-weight:600;padding:.4rem .8rem;border-radius:999px;border:1px solid var(--rule);background:var(--white);color:var(--ink-soft);cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.stories{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2rem 1.75rem}
.story{grid-column:span 2;display:flex;flex-direction:column;scroll-margin-top:5rem}
.story.wide{grid-column:span 3}
.story[hidden]{display:none}
.story .thumb{aspect-ratio:16/10;overflow:hidden;border-radius:3px;margin:0 0 .85rem}
.story .thumb svg{width:100%;height:100%}
.story .rubric{margin:0 0 .4rem;font-size:.7rem}
.story h3{font-family:var(--serif);font-size:1.3rem;line-height:1.2;margin:0 0 .5rem;letter-spacing:-.005em}
.story.wide h3{font-size:1.55rem}
.story p{font-size:1rem;line-height:1.55;color:var(--ink-soft);margin:0}
.no-match{font-family:var(--sans);font-size:.9rem;color:var(--ink-soft)}

/* Footer */
.site-footer{background:var(--ink);color:#cfd4d6;margin-top:4.5rem;padding:3rem 0 2rem;font-family:var(--sans);font-size:.88rem;line-height:1.6}
.site-footer a{color:#fff}
.f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2.5rem}
.f-brand{font-family:var(--serif);font-size:1.6rem;font-weight:800;color:#fff;margin:0 0 .6rem;letter-spacing:-.01em}
.site-footer h2{font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin:0 0 .75rem}
.site-footer p{margin:0 0 .6rem}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin:0 0 .45rem}
.f-bottom{border-top:1px solid #3a4144;margin-top:2.5rem;padding-top:1.25rem;font-size:.78rem;color:#9aa3a6}

/* Waterfall animation */
.fall-streak{stroke-dasharray:28 18;animation:fall 1.6s linear infinite}
.fall-streak.s2{animation-duration:2.1s}
.fall-streak.s3{animation-duration:1.3s}
@keyframes fall{to{stroke-dashoffset:-92}}

@media (max-width:1000px){
  .layout{grid-template-columns:1fr;gap:0}
  .sidebar{border-left:0;padding-left:0;margin-top:3rem}
  .sidebar .newsletter{display:none}
  .sidebar-inner{position:static}
}
@media (max-width:820px){
  .stories{grid-template-columns:repeat(2,minmax(0,1fr))}
  .story,.story.wide{grid-column:span 1}
  .story.wide h3{font-size:1.3rem}
  .f-grid{grid-template-columns:1fr 1fr}
  .f-grid > :first-child{grid-column:1/-1}
  .site-nav ul{justify-content:flex-start}
}
@media (max-width:600px){
  body{font-size:18px}
  .wrap{padding:0 1rem}
  .site-nav ul{padding:0 .5rem;justify-content:space-between;gap:0}
  .site-nav a{padding:.7rem .45rem;font-size:.7rem;letter-spacing:.05em}
  .meta .dot{display:none}
  .meta{gap:.2rem 1.1rem}
  .topbar .edition{display:none}
  .layout{padding-top:1.75rem}
  .standfirst{font-size:1.12rem}
  .pullquote{font-size:1.25rem}
  .newsletter{padding:1.4rem 1.15rem}
  .nl-row{flex-direction:column}
  .btn{width:100%}
  .stories{grid-template-columns:1fr;gap:2.25rem}
  .f-grid{grid-template-columns:1fr;gap:1.75rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .fall-streak{animation:none}
}

/* Story cards as links */
.story{position:relative}
.story h3 a{color:inherit;text-decoration:none}
.story h3 a::after{content:"";position:absolute;inset:0}
.story h3 a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.story:hover .thumb svg{transform:scale(1.03)}
.story .thumb svg{transition:transform .35s ease}

/* Story pages */
.story-page{max-width:44rem;margin:0 auto;padding-top:2.25rem}
.crumbs{font-family:var(--sans);font-size:.8rem;color:var(--ink-mute);margin:0 0 1.1rem}
.crumbs a{color:var(--ink-soft);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs span{margin:0 .4rem}
.story-page h1{max-width:none}
.hero-art{margin:0 0 2rem}
.hero-art .frame{aspect-ratio:16/9;overflow:hidden;border-radius:3px}
.hero-art svg{width:100%;height:100%}
.story-page .body{max-width:none}
.story-page .body h2{font-family:var(--serif);font-size:1.4rem;line-height:1.25;margin:2rem 0 .8rem}
.story-page .newsletter{margin-top:2.5rem}
.back-home{display:inline-block;margin-top:1.5rem;font-family:var(--sans);font-size:.9rem;font-weight:600;color:var(--accent);text-decoration:none}
.back-home:hover{text-decoration:underline}
.stories.related{grid-template-columns:repeat(4,minmax(0,1fr))}
.stories.related .story{grid-column:auto}
.stories.related h3{font-size:1.12rem}
@media (max-width:820px){.stories.related{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){
  .story-page{padding-top:1.5rem}
  .stories.related{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.story .thumb svg{transition:none}}

/* Video embed */
.video{margin:1.75rem 0 2rem}
.video-frame{position:relative;aspect-ratio:16/9;background:#111;border-radius:3px;overflow:hidden}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.body h2{font-family:var(--serif);font-size:1.4rem;line-height:1.25;margin:2rem 0 .8rem}
.video-link{position:absolute;inset:0;display:block;color:#fff;text-decoration:none}
.video-link img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease,opacity .3s}
.video-link:hover img{transform:scale(1.02);opacity:.9}
.video-link .play{position:absolute;left:1rem;bottom:1rem;display:inline-flex;align-items:center;gap:.6rem;padding:.75rem 1.2rem;border-radius:999px;background:rgba(0,0,0,.72);font-family:var(--sans);font-size:.95rem;font-weight:600;white-space:nowrap}
.play-ic{width:0;height:0;border-left:14px solid #fff;border-top:9px solid transparent;border-bottom:9px solid transparent}
.video-link:hover .play{background:#c4302b}
