:root{
  --paper:#F5F2EE;
  --bone:#ECE7DF;
  --chalk:#FBF9F5;
  --ink:#1A1D22;
  --graphite:#4A4E55;
  --mist:#8F95A0;
  --whisper:#6FA8CE;
  --whisper-deep:#3F7EAD;
  --line:rgba(26,29,34,0.10);
  --line-soft:rgba(26,29,34,0.06);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:14.5px;
  font-weight:300;
  line-height:1.6;
  letter-spacing:0.005em;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
button,input{font:inherit}

.mono,.topic,.meta-row,.nav-link,.crumb,.k,.dir,.read,.clbl,.lbl,.legal,h6{
  font-family:"JetBrains Mono","SFMono-Regular",Consolas,monospace;
  font-size:10.5px;
  letter-spacing:0.18em;
  text-transform:uppercase;
}

.marquee{background:var(--ink);color:var(--paper);padding:9px 0;overflow:hidden}
.marquee-track{display:flex;gap:60px;white-space:nowrap;animation:journal-scroll 52s linear infinite}
.marquee-track span{font-family:"JetBrains Mono","SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:0.2em;text-transform:uppercase}
.marquee-track span::before{content:"\00A7";margin-right:24px;color:var(--whisper)}
@keyframes journal-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

nav.top{
  position:sticky;
  top:0;
  z-index:50;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:40px;
  padding:18px 40px;
  background:rgba(245,242,238,0.86);
  border-bottom:1px solid var(--line-soft);
  backdrop-filter:blur(14px);
}
nav.top .left,nav.top .right{display:flex;align-items:center;gap:32px}
nav.top .right{justify-content:flex-end}
nav.top a{position:relative;color:var(--ink);padding-bottom:2px}
nav.top a.active{color:var(--whisper-deep)}
nav.top a:hover::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--ink)}
.brand{
  font-family:"Fraunces",Georgia,serif;
  font-size:22px;
  font-weight:300;
  letter-spacing:0.02em;
  font-variation-settings:"opsz" 144;
  display:inline-flex;
  align-items:center;
  min-height:44px;
  color:var(--ink);
  text-decoration:none;
}
.brand sup,.wordmark-foot sup{font-size:0.5em;vertical-align:super}

.crumb{
  display:flex;
  align-items:center;
  gap:14px;
  padding:24px 64px;
  color:var(--mist);
  border-bottom:1px solid var(--line-soft);
}
.crumb a{color:var(--graphite)}
.crumb strong{color:var(--ink);font-weight:500}

.article-head{
  padding:86px 64px 72px;
  border-bottom:1px solid var(--line-soft);
}
.meta-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  color:var(--graphite);
  margin-bottom:34px;
}
.meta-row .topic{color:var(--whisper-deep);font-weight:500}
.dot{width:5px;height:5px;border-radius:50%;background:var(--whisper);box-shadow:0 0 0 3px rgba(111,168,206,0.16)}
.head-grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(260px,0.58fr);
  gap:64px;
  align-items:end;
}
h1,h2,h3,h4{
  margin:0;
  font-family:"Fraunces",Georgia,serif;
  font-weight:300;
  letter-spacing:0;
  font-variation-settings:"opsz" 144;
}
h1{
  max-width:13ch;
  font-size:clamp(50px,7.6vw,104px);
  line-height:0.98;
  letter-spacing:-0.022em;
}
h1 em,h2 em,h3 em,h4 em{font-style:italic;color:var(--whisper-deep)}
.dek{
  margin:0;
  max-width:39ch;
  color:var(--graphite);
  font-family:"Fraunces",Georgia,serif;
  font-size:clamp(19px,2vw,28px);
  font-style:italic;
  line-height:1.38;
}

.article-figure{
  position:relative;
  min-height:360px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    linear-gradient(135deg,rgba(111,168,206,0.16),rgba(245,242,238,0) 42%),
    radial-gradient(circle at 76% 18%,rgba(63,126,173,0.16),transparent 30%),
    var(--bone);
  border-bottom:1px solid var(--line-soft);
}
.glyph{
  font-family:"Fraunces",Georgia,serif;
  font-size:clamp(86px,17vw,220px);
  font-weight:300;
  font-style:italic;
  color:rgba(26,29,34,0.18);
  letter-spacing:-0.04em;
}
.img-corner{
  position:absolute;
  color:var(--graphite);
  font-family:"JetBrains Mono","SFMono-Regular",Consolas,monospace;
  font-size:10px;
  letter-spacing:0.18em;
  text-transform:uppercase;
}
.tick{display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:var(--whisper)}

.article-body{
  display:grid;
  grid-template-columns:240px minmax(0,820px);
  gap:64px;
  width:min(1240px,100%);
  margin:0 auto;
  padding:86px 64px 96px;
}
.meta-aside{
  position:sticky;
  top:96px;
  align-self:start;
  display:grid;
  gap:1px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.block{padding:18px 0;border-top:1px solid var(--line-soft)}
.block:first-child{border-top:0}
.k{display:block;color:var(--mist);margin-bottom:7px}
.v{display:block;color:var(--ink);font-size:13px;line-height:1.45}
.v.small{color:var(--graphite)}
.prose{min-width:0}
.prose .lede{
  color:var(--ink);
  font-family:"Fraunces",Georgia,serif;
  font-size:clamp(22px,2.5vw,34px);
  font-weight:300;
  line-height:1.35;
  letter-spacing:-0.006em;
}
.prose p,.prose li,.prose td,.prose th{
  color:#292620;
  font-size:17px;
  line-height:1.82;
}
.prose p{margin:0 0 22px}
.prose ul,.prose ol{margin:0 0 28px;padding-left:24px}
.prose li+li{margin-top:10px}
.prose h2{
  margin:68px 0 24px;
  padding-top:18px;
  border-top:1px solid var(--line);
  font-size:clamp(34px,4.8vw,60px);
  line-height:1.02;
  letter-spacing:-0.016em;
}
.prose h3{
  margin:36px 0 12px;
  color:var(--ink);
  font-size:clamp(24px,3vw,34px);
  line-height:1.12;
}
.prose h4{font-size:clamp(24px,3vw,36px);line-height:1.16}
.prose a:not(.back-link){
  color:var(--whisper-deep);
  border-bottom:1px solid rgba(63,126,173,0.42);
}
.prose blockquote{
  margin:46px 0;
  padding:0 0 0 28px;
  border-left:1px solid var(--whisper);
}
.prose blockquote p{
  color:var(--ink);
  font-family:"Fraunces",Georgia,serif;
  font-size:clamp(24px,3vw,40px);
  font-style:italic;
  line-height:1.22;
}
.source-link-row{display:inline-flex;margin:4px 14px 18px 0}
.source-link-row a,.back-link{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  color:var(--whisper-deep);
  border-bottom:1px solid currentColor;
  text-decoration:none;
}
.reference-heading{color:var(--whisper-deep)}
.reference-list{padding-left:22px}
.table-scroll{
  width:100%;
  overflow-x:auto;
  margin:34px 0;
  border:1px solid var(--line);
  background:rgba(255,255,255,0.2);
  -webkit-overflow-scrolling:touch;
}
.table-scroll table{width:100%;min-width:680px;border-collapse:collapse}
.table-scroll th,.table-scroll td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.table-scroll thead th{
  color:var(--whisper-deep);
  font-family:"JetBrains Mono","SFMono-Regular",Consolas,monospace;
  font-size:10.5px;
  letter-spacing:0.12em;
  text-transform:uppercase;
}
.table-scroll tbody th{color:var(--ink);font-weight:500}
.callout,.cta{
  margin:58px 0 46px;
  padding:32px 0;
  border-top:1px solid rgba(63,126,173,0.28);
  border-bottom:1px solid rgba(63,126,173,0.28);
}
.callout p,.cta p{max-width:60ch}
.clbl,.lbl{display:block;color:var(--whisper-deep);margin-bottom:14px}
.references{
  margin-top:66px;
  padding-top:28px;
  border-top:1px solid var(--line);
}
.references h3{margin-bottom:22px}
.evidence-note{
  margin-top:28px;
  padding-left:22px;
  border-left:1px solid rgba(63,126,173,0.36);
}
.compare-table{
  display:grid;
  margin:32px 0 42px;
  border:1px solid var(--line);
  overflow-x:auto;
}
.compare-table .row{display:grid;grid-template-columns:1.1fr repeat(3,minmax(150px,1fr));min-width:720px;border-top:1px solid var(--line-soft)}
.compare-table .row:first-child{border-top:0}
.compare-table .head{background:var(--chalk);color:var(--whisper-deep);font-family:"JetBrains Mono","SFMono-Regular",Consolas,monospace;font-size:10.5px;letter-spacing:0.12em;text-transform:uppercase}
.compare-table .cell{padding:14px 16px;border-left:1px solid var(--line-soft);font-size:14px;line-height:1.55}
.compare-table .cell:first-child{border-left:0}

.article-nav{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
  background:var(--chalk);
}
.article-nav a,.article-nav span.disabled{display:flex;min-height:132px;flex-direction:column;justify-content:center;gap:8px;padding:28px 64px}
.article-nav .next{align-items:flex-end;text-align:right;border-left:1px solid var(--line-soft)}
.dir{color:var(--mist)}
.ttl{font-family:"Fraunces",Georgia,serif;font-size:24px;line-height:1.12}
.disabled{color:var(--mist)}

.related{padding:86px 64px;background:var(--paper);border-bottom:1px solid var(--line-soft)}
.related-head{
  display:grid;
  grid-template-columns:1fr minmax(260px,0.42fr);
  gap:48px;
  width:min(1200px,100%);
  margin:0 auto 48px;
  align-items:end;
}
.related h2{font-size:clamp(38px,4.6vw,68px);line-height:1.02;letter-spacing:-0.016em}
.related .right{color:var(--graphite);font-size:15px;line-height:1.7}
.related-cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  width:min(1200px,100%);
  margin:0 auto;
  border:1px solid var(--line);
  background:var(--line);
}
.related-cards a{display:flex;min-height:280px;flex-direction:column;justify-content:space-between;padding:32px;background:var(--paper)}
.related-cards h3{margin:18px 0;font-size:clamp(26px,3vw,40px);line-height:1.08}
.related-cards p{margin:0;color:var(--graphite);font-size:14.5px;line-height:1.7}
.read{color:var(--whisper-deep);margin-top:24px}

.journal-cta{
  display:grid;
  grid-template-columns:1fr minmax(280px,0.58fr);
  gap:64px;
  align-items:center;
  padding:96px 64px;
  color:var(--bone);
  background:var(--ink);
}
.journal-cta h2{color:var(--bone);font-size:clamp(42px,5.8vw,84px);line-height:0.98;letter-spacing:-0.02em}
.journal-cta h2 em{color:var(--whisper)}
.journal-cta p{margin:0;color:rgba(245,242,238,0.78);font-size:15px;line-height:1.75}
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
.btn-light,.btn-outline{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 18px;
  border:1px solid rgba(245,242,238,0.5);
  font-family:"JetBrains Mono","SFMono-Regular",Consolas,monospace;
  font-size:10.5px;
  letter-spacing:0.16em;
  text-transform:uppercase;
}
.btn-light{background:var(--bone);color:var(--ink);border-color:var(--bone)}
.btn-outline{color:var(--bone)}

footer{background:var(--ink);color:var(--bone)}
.foot-top{
  display:grid;
  grid-template-columns:1.5fr repeat(3,1fr);
  gap:48px;
  padding:72px 64px 48px;
  border-top:1px solid rgba(245,242,238,0.12);
}
h6{margin:0 0 18px;color:var(--whisper);font-weight:500}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
footer a{color:rgba(245,242,238,0.78)}
.signup{display:flex;gap:10px;margin-top:24px;max-width:420px}
.signup input{min-width:0;flex:1;height:44px;border:1px solid rgba(245,242,238,0.18);background:rgba(245,242,238,0.08);color:var(--bone);padding:0 14px}
.signup button{height:44px;border:1px solid var(--bone);background:var(--bone);color:var(--ink);padding:0 16px;cursor:pointer}
.wordmark-foot{
  padding:0 64px 24px;
  color:rgba(245,242,238,0.16);
  font-family:"Fraunces",Georgia,serif;
  font-size:clamp(62px,13vw,190px);
  line-height:0.8;
  letter-spacing:-0.04em;
}
.legal{
  display:flex;
  justify-content:space-between;
  gap:24px;
  padding:22px 64px;
  color:rgba(245,242,238,0.55);
  border-top:1px solid rgba(245,242,238,0.12);
}

@media(max-width:980px){
  nav.top{grid-template-columns:1fr;padding:18px 22px;gap:16px}
  nav.top .left,nav.top .right{gap:18px;flex-wrap:wrap;justify-content:flex-start}
  nav.top .brand{justify-self:start}
  .crumb,.article-head,.related,.journal-cta,.foot-top,.wordmark-foot,.legal{padding-left:22px;padding-right:22px}
  .head-grid,.article-body,.related-head,.journal-cta,.foot-top{grid-template-columns:1fr}
  .article-body{padding:64px 22px 76px}
  .meta-aside{position:static}
  .related-cards{grid-template-columns:1fr}
  .article-nav{grid-template-columns:1fr}
  .article-nav .next{border-left:0;border-top:1px solid var(--line-soft);align-items:flex-start;text-align:left}
  .article-nav a,.article-nav span.disabled{padding:26px 22px}
  .article-figure{min-height:260px}
  .legal{flex-direction:column}
}

@media(max-width:560px){
  .marquee-track{gap:36px}
  h1{font-size:clamp(44px,16vw,70px)}
  .article-head{padding-top:58px;padding-bottom:50px}
  .meta-row{align-items:flex-start}
  .signup{flex-direction:column}
  .actions{flex-direction:column;align-items:stretch}
}