:root {
  --paper: #f2eee4;
  --paper-light: #fbf9f3;
  --paper-deep: #e8e0d1;
  --ink: #13213c;
  --ink-soft: #566070;
  --teal: #176d6a;
  --teal-light: #d9ebe7;
  --red: #b4473c;
  --gold: #c89521;
  --rule: #cfc6b6;
  --white: #fff;
  --shell: min(1480px, calc(100% - 72px));
  --serif: "Newsreader", Georgia, serif;
  --sans: "IBM Plex Sans", Arial, sans-serif;
  --text-scale: 1;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: calc(16px * var(--text-scale)); line-height: 1.5; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
img { display: block; width: 100%; }
.page-shell { width: var(--shell); margin-inline: auto; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 1000; left: 16px; top: -70px; background: var(--ink); color: white; padding: 11px 16px; font-weight: 700; transition: top .2s; }
.skip-link:focus { top: 16px; }

.demo-ribbon { background: var(--ink); color: #dce3ec; }
.demo-ribbon .page-shell { min-height: 30px; display: flex; align-items: center; gap: 16px; font-size: 9px; letter-spacing: .09em; text-transform: uppercase; }
.demo-ribbon span { color: #f1d06f; font-weight: 700; }
.demo-ribbon p { margin: 0; color: #94a0b1; }
.reading-mode { margin-left: auto; padding: 4px 10px; border: 1px solid #506078; background: transparent; color: #f5f7fa; cursor: pointer; font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }

.site-header { background: var(--paper-light); border-bottom: 1px solid var(--ink); }
.masthead { min-height: 128px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.edition-block { display: grid; width: max-content; gap: 1px; color: var(--ink-soft); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.edition-block b { color: var(--ink); font-size: 11px; }
.edition-block small { color: #8a8277; font-size: 8px; }
.brand { justify-self: center; position: relative; display: flex; align-items: baseline; font-family: var(--serif); line-height: .8; letter-spacing: -.055em; }
.brand > span { font-size: clamp(52px, 6vw, 90px); font-weight: 600; }
.brand > b { margin-left: 9px; padding: 6px 8px 4px; background: var(--red); color: white; font-family: var(--sans); font-size: clamp(13px, 1.6vw, 22px); letter-spacing: .16em; }
.brand > small { align-self: flex-start; margin: 4px 0 0 4px; color: var(--teal); font-family: var(--sans); font-size: 8px; font-weight: 700; letter-spacing: .12em; }
.header-actions { justify-self: end; display: flex; align-items: stretch; height: 38px; }
.font-button { width: 40px; border: 1px solid var(--rule); background: transparent; cursor: pointer; font-family: var(--serif); }
.font-button + .font-button { border-left: 0; }
.font-button:hover { background: var(--paper-deep); }
.search-open { display: flex; align-items: center; gap: 10px; margin-left: 10px; padding: 0 13px; border: 1px solid var(--rule); background: transparent; cursor: pointer; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }
.search-open b { color: var(--teal); font-size: 18px; line-height: 0; }
.menu-button { display: none; width: 42px; border: 1px solid var(--rule); background: transparent; cursor: pointer; }
.menu-button i { display: block; width: 18px; height: 1px; margin: 5px auto; background: var(--ink); }

.main-nav { border-top: 1px solid var(--rule); }
.nav-inner { display: flex; align-items: center; justify-content: center; gap: clamp(20px, 3.5vw, 50px); }
.main-nav a { position: relative; padding: 14px 0 13px; color: #596274; font-size: 10px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; }
.main-nav a:hover, .main-nav a.active { color: var(--red); }
.main-nav a.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: var(--red); }

.top-line { overflow: hidden; background: var(--red); color: white; }
.top-line-grid { height: 38px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; }
.top-label { align-self: stretch; display: flex; align-items: center; padding-right: 18px; border-right: 1px solid rgba(255,255,255,.3); font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.top-window { min-width: 0; overflow: hidden; }
.top-track { display: flex; width: max-content; gap: 85px; font-size: 9px; font-weight: 600; letter-spacing: .09em; white-space: nowrap; animation: topTicker 34s linear infinite; }
.top-track.paused { animation-play-state: paused; }
@keyframes topTicker { to { transform: translateX(-50%); } }
.ticker-toggle { border: 0; background: transparent; color: white; cursor: pointer; font-size: 9px; }

.front-page { display: grid; grid-template-columns: minmax(210px, .72fr) minmax(0, 2.2fr) minmax(240px, .86fr); gap: 24px; padding-block: 42px 48px; }
.daily-brief, .policy-wire { min-width: 0; }
.section-label { display: flex; align-items: center; gap: 10px; padding-bottom: 10px; border-bottom: 3px double var(--ink); text-transform: uppercase; }
.section-label > span { color: var(--red); font-family: var(--serif); font-size: 11px; font-weight: 600; }
.section-label > b { font-size: 11px; letter-spacing: .11em; }
.daily-brief ol { list-style: none; padding: 0; margin: 0; counter-reset: brief; }
.daily-brief li { border-bottom: 1px solid var(--rule); }
.daily-brief li a { display: grid; grid-template-columns: 40px 1fr; gap: 6px 10px; padding: 15px 0; }
.daily-brief time { grid-row: span 2; color: var(--red); font-family: var(--serif); font-size: 13px; }
.daily-brief li b { font-family: var(--serif); font-size: 16px; line-height: 1.05; }
.daily-brief li b:hover { color: var(--teal); }
.daily-brief li small { color: #82796e; font-size: 8px; letter-spacing: .09em; text-transform: uppercase; }
.line-link { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; color: var(--teal); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.line-link:hover { color: var(--red); }

.lead-story { border-inline: 1px solid var(--rule); padding-inline: 24px; }
.lead-image { position: relative; aspect-ratio: 16 / 8.8; overflow: hidden; background: var(--paper-deep); }
.lead-image img { height: 100%; object-fit: cover; transition: transform .8s ease; }
.lead-story:hover .lead-image img { transform: scale(1.025); }
.image-credit { position: absolute; right: 0; bottom: 0; padding: 5px 8px; background: rgba(19,33,60,.85); color: white; font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }
.lead-copy { padding-top: 18px; }
.article-flags { display: flex; align-items: center; gap: 12px; }
.article-flags span, .story-tag { color: var(--red); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.article-flags i { color: #827a70; font-size: 8px; font-style: normal; }
.lead-copy h1 { max-width: 900px; margin: 12px 0 13px; font-family: var(--serif); font-size: clamp(38px, 4.2vw, 69px); font-weight: 600; line-height: .92; letter-spacing: -.045em; }
.lead-copy > p { max-width: 800px; margin: 0 0 18px; color: var(--ink-soft); font-family: var(--serif); font-size: 17px; line-height: 1.25; }
.article-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 12px; border-top: 1px solid var(--rule); color: #777064; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.bookmark { border: 0; background: transparent; color: var(--teal); cursor: pointer; font-size: 8px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.bookmark.saved { color: var(--red); }

.policy-wire .section-label > span { padding: 3px 6px; background: var(--red); color: white; font-family: var(--sans); font-size: 7px; }
.policy-wire .section-label > i { width: 6px; height: 6px; margin-left: auto; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 5px rgba(180,71,60,.13); animation: wirePulse 1.8s infinite; }
@keyframes wirePulse { 50% { box-shadow: 0 0 0 9px rgba(180,71,60,0); } }
.wire-list article { position: relative; display: grid; grid-template-columns: 43px 1fr; gap: 11px; padding: 16px 0 16px 13px; border-bottom: 1px solid var(--rule); }
.wire-list article::before { content: ""; position: absolute; left: 0; top: 20px; width: 4px; height: 4px; border-radius: 50%; background: var(--teal); }
.wire-list time { color: var(--red); font-family: var(--serif); font-size: 13px; }
.wire-list b { display: block; font-family: var(--serif); font-size: 15px; line-height: 1.08; }
.wire-list small { display: block; margin-top: 5px; color: #837b70; font-size: 7px; letter-spacing: .1em; text-transform: uppercase; }
.wire-more { width: 100%; margin-top: 14px; padding: 10px; border: 1px solid var(--ink); background: transparent; cursor: pointer; font-size: 8px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.wire-more:hover { background: var(--ink); color: white; }

.context-strip { border-block: 1px solid var(--ink); background: var(--paper-light); }
.context-grid { min-height: 82px; display: grid; grid-template-columns: 1.15fr repeat(4, 1fr); }
.context-grid > div { display: grid; align-content: center; gap: 2px; padding: 12px 20px; border-left: 1px solid var(--rule); }
.context-grid > div:last-child { border-right: 1px solid var(--rule); }
.context-grid span { color: #7f776d; font-size: 7px; letter-spacing: .11em; text-transform: uppercase; }
.context-grid b { font-family: var(--serif); font-size: 15px; }
.context-grid em { justify-self: start; padding: 2px 5px; background: #e5e1d8; color: #5f5a52; font-size: 7px; font-style: normal; text-transform: uppercase; }
.context-grid em.status-teal { background: var(--teal-light); color: var(--teal); }
.context-grid em.status-red { background: #f1ded9; color: var(--red); }
.context-grid em.status-gold { background: #f3e8c5; color: #886410; }
.context-grid .context-title { border-left: 0; padding-left: 0; }
.context-title small { color: var(--red); font-size: 7px; letter-spacing: .12em; text-transform: uppercase; }
.context-title b { font-size: 23px; }

.essential { padding-block: 82px 90px; }
.large-heading { display: grid; grid-template-columns: 1fr 2.4fr 1fr; align-items: end; gap: 28px; margin-bottom: 34px; padding-bottom: 22px; border-bottom: 3px double var(--ink); }
.large-heading > span, .topic-head > div:first-child > span, .record-intro > span { color: var(--red); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.large-heading h2 { margin: 0; font-family: var(--serif); font-size: clamp(42px, 5.8vw, 84px); font-weight: 500; line-height: .82; letter-spacing: -.05em; }
.large-heading p { margin: 0; color: var(--ink-soft); font-family: var(--serif); font-size: 15px; line-height: 1.25; }
.essential-grid { display: grid; grid-template-columns: minmax(0, 2.3fr) minmax(290px, .75fr); gap: 60px; }
.essential-feed { border-top: 1px solid var(--ink); }
.wide-story { display: grid; grid-template-columns: 130px 1fr; gap: 24px; padding-block: 26px; border-bottom: 1px solid var(--rule); }
.story-number { display: grid; place-items: center; min-height: 145px; background: var(--ink); color: var(--paper); font-family: var(--serif); font-size: 42px; }
.story-body h3 { max-width: 760px; margin: 8px 0 10px; font-family: var(--serif); font-size: clamp(25px, 3vw, 41px); font-weight: 600; line-height: .98; letter-spacing: -.025em; }
.story-body h3 a:hover { color: var(--teal); }
.story-body > p { margin: 0 0 17px; color: var(--ink-soft); font-family: var(--serif); font-size: 15px; }
.with-photo { grid-template-columns: minmax(190px, .9fr) minmax(0, 1.6fr); }
.story-photo { min-height: 220px; overflow: hidden; }
.story-photo img { height: 100%; object-fit: cover; transition: transform .6s; }
.with-photo:hover img { transform: scale(1.04); }
.argument { align-self: start; padding: 22px; border: 1px solid var(--ink); background: var(--paper-light); }
.argument-header { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 15px; border-bottom: 3px double var(--ink); }
.argument-header span { font-family: var(--serif); font-size: 24px; font-weight: 700; }
.argument-header small { color: var(--red); font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }
.argument > article { position: relative; padding: 23px 0 23px 50px; border-bottom: 1px solid var(--rule); }
.argument .author-mark { position: absolute; left: 0; top: 23px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: var(--teal); color: white; font-family: var(--serif); font-size: 12px; }
.argument .author-mark.alt { background: var(--red); }
.argument article > span { color: var(--red); font-size: 7px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.argument h3 { margin: 6px 0 9px; font-family: var(--serif); font-size: 22px; line-height: 1.02; }
.argument h3 a:hover { color: var(--teal); }
.argument article > p { margin: 0; color: #797166; font-size: 8px; text-transform: uppercase; }
.argument .argument-note { padding-left: 0; border-bottom: 0; }
.argument-note b { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.argument .argument-note p { margin-top: 8px; color: var(--ink-soft); font-family: var(--serif); font-size: 14px; text-transform: none; }

.topic-desk { padding-block: 80px 90px; background: var(--ink); color: var(--paper-light); }
.topic-head { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 30px; padding-bottom: 25px; border-bottom: 1px solid #687184; }
.topic-head h2 { max-width: 750px; margin: 8px 0 0; font-family: var(--serif); font-size: clamp(42px, 5vw, 72px); font-weight: 500; line-height: .9; letter-spacing: -.04em; }
.topic-filters { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.topic-filters button { padding: 8px 12px; border: 1px solid #59647a; background: transparent; color: #bbc3cf; cursor: pointer; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.topic-filters button:hover, .topic-filters button.active { border-color: #d0a334; background: #d0a334; color: var(--ink); }
.dispatch-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 1px; margin-top: 28px; background: #4e596d; }
.dispatch { position: relative; grid-column: span 4; min-height: 280px; padding: 23px; background: #172743; }
.dispatch[hidden] { display: none; }
.feature-dispatch { grid-column: span 8; min-height: 360px; background: var(--paper-light); color: var(--ink); }
.dispatch-top { display: flex; justify-content: space-between; color: #98a5b8; font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.feature-dispatch .dispatch-top { color: #766f64; }
.dispatch-top span { color: #68b5ae; font-weight: 700; }
.feature-dispatch .dispatch-top span { color: var(--red); }
.dispatch h3 { max-width: 700px; margin: 25px 0 13px; font-family: var(--serif); font-size: clamp(25px, 2.5vw, 39px); font-weight: 500; line-height: .98; }
.feature-dispatch h3 { font-size: clamp(35px, 4vw, 58px); }
.dispatch h3 a:hover { color: #84c9c4; }
.feature-dispatch h3 a:hover { color: var(--teal); }
.dispatch > p { max-width: 680px; color: #aab5c5; font-family: var(--serif); font-size: 14px; }
.feature-dispatch > p { color: var(--ink-soft); font-size: 16px; }
.dispatch .bookmark { position: absolute; left: 23px; bottom: 22px; color: #72bcb6; }
.feature-dispatch .bookmark { color: var(--teal); }
.mini-flow { display: flex; align-items: center; gap: 9px; margin-top: 28px; }
.mini-flow span { padding: 8px 12px; border: 1px solid var(--rule); font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.mini-flow i { color: var(--red); font-style: normal; }
.photo-dispatch { padding: 0; overflow: hidden; }
.photo-dispatch > img { height: 100%; min-height: 280px; object-fit: cover; }
.photo-dispatch::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 25%, rgba(10,20,39,.94)); }
.photo-overlay { position: absolute; z-index: 2; left: 22px; right: 22px; bottom: 21px; }
.photo-overlay h3 { margin-bottom: 0; }
.quote-dispatch { background: var(--teal); }
.quote-dispatch .dispatch-top, .quote-dispatch .dispatch-top span { color: #d2e9e6; }
.quote-dispatch blockquote { margin: 23px 0 15px; font-family: var(--serif); font-size: clamp(25px, 2.7vw, 38px); line-height: .96; }
.quote-dispatch > p { color: #d4e6e4; }
.topic-empty { padding: 30px; text-align: center; border: 1px solid #59647a; color: #aab5c5; }

.public-record { display: grid; grid-template-columns: minmax(240px, .72fr) minmax(0, 2.2fr); gap: 70px; padding-block: 85px 92px; }
.record-intro h2 { margin: 12px 0 14px; font-family: var(--serif); font-size: clamp(50px, 5.4vw, 78px); font-weight: 500; line-height: .85; letter-spacing: -.04em; }
.record-intro > p { color: var(--ink-soft); font-family: var(--serif); font-size: 15px; }
.record-list { border-top: 3px double var(--ink); }
.record-row { display: grid; grid-template-columns: .6fr 2fr 1fr 1fr 25px; align-items: center; gap: 15px; min-height: 63px; padding-inline: 10px; border-bottom: 1px solid var(--rule); }
.record-row:not(.record-header):hover { background: var(--paper-light); }
.record-header { min-height: 40px; color: #81796e; font-size: 7px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.record-row > b { color: var(--red); font-family: var(--serif); font-size: 13px; }
.record-row > span { font-family: var(--serif); font-size: 15px; }
.record-row > time { color: #7d756a; font-size: 8px; }
.record-row > i { color: var(--teal); font-style: normal; }
.stage { justify-self: start; padding: 4px 7px; font-size: 7px; font-style: normal; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.stage.active { background: var(--teal-light); color: var(--teal); }
.stage.review { background: #efe5c8; color: #806218; }
.stage.draft { background: #e5e1d9; color: #665f56; }
.stage.closed { background: #eedbd8; color: var(--red); }

.newsletter { padding-block: 75px; background: var(--teal); color: white; }
.newsletter-grid { display: grid; grid-template-columns: 1.4fr 1fr; align-items: end; gap: 80px; }
.newsletter-grid > div > span { color: #d8b45d; font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.newsletter-grid h2 { margin: 14px 0 0; font-family: var(--serif); font-size: clamp(50px, 6.5vw, 94px); font-weight: 500; line-height: .8; letter-spacing: -.045em; }
.newsletter-form > p:first-child { max-width: 500px; color: #d5e6e4; font-family: var(--serif); font-size: 16px; }
.newsletter-form label { display: grid; grid-template-columns: 1fr auto; margin-top: 26px; border-bottom: 1px solid white; }
.newsletter-form input { min-width: 0; padding: 13px 0; border: 0; outline: 0; background: transparent; color: white; font-family: var(--serif); font-size: 20px; }
.newsletter-form input::placeholder { color: rgba(255,255,255,.58); }
.newsletter-form button { border: 0; background: transparent; color: #f0cb6c; cursor: pointer; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.newsletter-form small { display: block; margin-top: 10px; color: rgba(255,255,255,.55); font-size: 7px; }
.form-status { min-height: 18px; margin: 12px 0 0; color: #f2d784; font-size: 9px; }

.site-footer { padding: 70px 0 25px; background: #0d182c; color: white; }
.footer-main { display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 45px; padding-bottom: 65px; }
.footer-brand { justify-self: start; color: white; }
.footer-brand > span { font-size: 32px; }
.footer-brand > b { font-size: 10px; }
.footer-main > div:first-child > p { max-width: 300px; color: #8793a7; font-family: var(--serif); font-size: 13px; }
.footer-main > div:not(:first-child) { display: flex; flex-direction: column; gap: 10px; color: #8f9aae; font-size: 10px; }
.footer-main > div:not(:first-child) > b { margin-bottom: 7px; color: white; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }
.footer-main a:hover { color: #78c1ba; }
.footer-bottom { display: flex; justify-content: space-between; padding-top: 20px; border-top: 1px solid #334057; color: #748198; font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }

dialog { width: min(780px, calc(100% - 30px)); padding: 0; border: 1px solid var(--ink); background: var(--paper-light); color: var(--ink); box-shadow: 0 30px 100px rgba(10,20,40,.45); }
dialog::backdrop { background: rgba(13,24,44,.82); backdrop-filter: blur(6px); }
.dialog-bar { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; border-bottom: 1px solid var(--rule); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.dialog-bar button { border: 0; background: transparent; cursor: pointer; font-size: 25px; }
.search-field { display: flex; align-items: center; gap: 13px; margin: 30px 30px 10px; border-bottom: 2px solid var(--teal); }
.search-field span { color: var(--teal); font-size: 28px; }
.search-field input { flex: 1; min-width: 0; padding: 14px 0; border: 0; outline: 0; background: transparent; color: var(--ink); font-family: var(--serif); font-size: clamp(24px, 4vw, 39px); }
.search-help { margin: 12px 30px 26px; color: #847c70; font-size: 9px; }
.search-results { max-height: 320px; overflow: auto; padding: 0 30px 30px; }
.search-result { display: block; padding: 14px 0; border-top: 1px solid var(--rule); }
.search-result small { color: var(--red); font-size: 7px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.search-result b { display: block; margin-top: 4px; font-family: var(--serif); font-size: 18px; }

body.focus-mode .daily-brief,
body.focus-mode .policy-wire,
body.focus-mode .context-strip,
body.focus-mode .argument { display: none; }
body.focus-mode .front-page { grid-template-columns: minmax(0, 950px); justify-content: center; }
body.focus-mode .lead-story { border: 0; }
body.focus-mode .essential-grid { grid-template-columns: minmax(0, 900px); justify-content: center; }

@media (max-width: 1140px) {
  :root { --shell: min(100% - 48px, 1000px); }
  .front-page { grid-template-columns: .72fr 2fr; }
  .policy-wire { grid-column: 1 / -1; display: grid; grid-template-columns: 220px 1fr; gap: 20px; padding-top: 20px; border-top: 1px solid var(--ink); }
  .policy-wire .wire-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
  .wire-list article:nth-child(n+4) { display: none; }
  .wire-more { grid-column: 2; }
  .context-grid { grid-template-columns: repeat(4, 1fr); }
  .context-title { grid-column: 1 / -1; border-bottom: 1px solid var(--rule); }
  .context-grid .context-title { padding: 10px 0; }
  .large-heading { grid-template-columns: 1fr 2.4fr; }
  .large-heading p { grid-column: 2; }
  .essential-grid { gap: 35px; }
  .dispatch { grid-column: span 6; }
  .feature-dispatch { grid-column: span 12; }
  .public-record { gap: 35px; }
}

@media (max-width: 820px) {
  :root { --shell: min(100% - 32px, 720px); }
  .masthead { min-height: 94px; grid-template-columns: 44px 1fr auto; gap: 8px; }
  .edition-block { display: none; }
  .brand { justify-self: center; }
  .brand > span { font-size: 48px; }
  .brand > b { font-size: 12px; }
  .header-actions .font-button, .search-open span { display: none; }
  .search-open { width: 42px; justify-content: center; margin-left: 0; padding: 0; }
  .menu-button { display: block; }
  .main-nav { max-height: 0; overflow: hidden; border-top: 0; transition: max-height .3s; }
  .main-nav.open { max-height: 320px; border-top: 1px solid var(--rule); }
  .nav-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 0; padding: 10px 0; }
  .main-nav a { padding: 10px; }
  .main-nav a.active::after { display: none; }
  .front-page { grid-template-columns: 1fr; }
  .daily-brief { order: 2; }
  .lead-story { order: 1; border-inline: 0; padding-inline: 0; }
  .policy-wire { order: 3; grid-column: auto; grid-template-columns: 1fr; }
  .policy-wire .wire-list { grid-template-columns: 1fr 1fr; }
  .wire-more { grid-column: auto; }
  .context-grid { grid-template-columns: 1fr 1fr; }
  .large-heading { grid-template-columns: 1fr; }
  .large-heading p { grid-column: auto; }
  .essential-grid { grid-template-columns: 1fr; }
  .argument { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
  .argument-header, .argument-note { grid-column: 1 / -1; }
  .topic-head { grid-template-columns: 1fr; }
  .topic-filters { justify-content: flex-start; }
  .public-record { grid-template-columns: 1fr; }
  .newsletter-grid { grid-template-columns: 1fr; gap: 40px; }
  .footer-main { grid-template-columns: 1.5fr 1fr 1fr; }
  .footer-main > div:first-child { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
  :root { --shell: calc(100% - 24px); }
  .demo-ribbon p { display: none; }
  .masthead { grid-template-columns: 38px 1fr auto; }
  .brand > span { font-size: 37px; }
  .brand > b { margin-left: 5px; padding: 5px 5px 3px; font-size: 9px; }
  .brand > small { display: none; }
  .top-line-grid { gap: 10px; }
  .top-label { padding-right: 10px; }
  .front-page { padding-top: 26px; }
  .lead-image { aspect-ratio: 4 / 3; }
  .lead-copy h1 { font-size: 42px; }
  .lead-copy > p { font-size: 15px; }
  .policy-wire .wire-list { grid-template-columns: 1fr; }
  .wire-list article:nth-child(n+3) { display: none; }
  .context-grid { grid-template-columns: 1fr; }
  .context-grid > div { border-left: 0; border-bottom: 1px solid var(--rule); padding: 12px 0; }
  .context-grid > div:last-child { border-right: 0; }
  .essential, .topic-desk, .public-record { padding-block: 58px; }
  .wide-story, .with-photo { grid-template-columns: 88px 1fr; gap: 14px; }
  .story-number { min-height: 115px; font-size: 28px; }
  .story-photo { min-height: 135px; }
  .story-body h3 { font-size: 24px; }
  .story-body > p { display: none; }
  .argument { display: block; }
  .topic-filters { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 8px; }
  .topic-filters button { flex: 0 0 auto; }
  .dispatch { grid-column: span 12; min-height: 260px; }
  .feature-dispatch { min-height: 390px; }
  .mini-flow { flex-wrap: wrap; }
  .record-row { grid-template-columns: .65fr 2fr 1fr 20px; padding-block: 10px; }
  .record-row > time, .record-header > span:nth-child(4) { display: none; }
  .record-row > span { font-size: 13px; }
  .newsletter-grid h2 { font-size: 58px; }
  .newsletter-form label { grid-template-columns: 1fr; }
  .newsletter-form button { justify-self: start; padding: 10px 0; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-bottom { gap: 12px; flex-wrap: wrap; }
}

@media (max-width: 390px) {
  .brand > span { font-size: 31px; }
  .lead-copy h1 { font-size: 37px; }
  .wide-story, .with-photo { grid-template-columns: 72px 1fr; }
  .story-body h3 { font-size: 21px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
