@font-face{font-family:'EB Garamond';src:url('/assets/fonts/garamond.woff2') format('woff2');font-style:normal;font-weight:400 600;font-display:swap}
@font-face{font-family:'EB Garamond';src:url('/assets/fonts/garamond-italic.woff2') format('woff2');font-style:italic;font-weight:400 600;font-display:swap}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.5 Arial,sans-serif}a{color:var(--lake);text-underline-offset:4px}a:focus-visible,input:focus-visible,button:focus-visible{outline:2px solid var(--lake);outline-offset:4px}img{max-width:100%;display:block}h1,h2,h3{font-family:'EB Garamond',serif;font-weight:500;line-height:1.15;margin:0}h1{font-size:clamp(40px,4.2vw,52px);line-height:1.06;text-wrap:balance}h2{font-size:32px}h3{font-size:22px}p{margin:0 0 16px}.container{width:min(100%,calc(var(--page-width) + 2*var(--page-gutter)));margin:auto;padding-left:var(--page-gutter);padding-right:var(--page-gutter)}.label,.eyebrow{font:400 11px/1.5 Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--lake)}.deck,.standfirst{font:400 18px/1.45 Arial,sans-serif;color:var(--stone);max-width:34em}.masthead{position:relative;border-top:3px solid var(--lake);background:var(--paper)}.masthead-art{display:none}.home .masthead-art{display:none}.home .masthead-inner,.home .top-nav{position:relative}.masthead-inner{display:flex;justify-content:center;padding:32px}.wordmark{color:var(--lake);text-decoration:none;font:500 32px/1 'EB Garamond',serif;letter-spacing:-.06em}.home .wordmark{font-size:72px}.wordmark-rule{display:flex;align-items:center;margin-top:4px}.wordmark-rule i{height:1px;background:var(--lake);flex:1}.wordmark-rule b,.wordmark-rule strong{width:8px;height:8px;border:1px solid var(--lake)}.wordmark-rule strong{background:var(--lake)}.top-nav{font:500 15px/1.45 Arial,sans-serif;display:flex;justify-content:center;flex-wrap:wrap;gap:32px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:12px 16px}body:not(.home):not(.library-page) > .masthead{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:16px max(var(--page-gutter),calc((100% - var(--page-width))/2));border-bottom:1px solid var(--rule)}body:not(.home):not(.library-page) > .masthead .masthead-inner{padding:0}body:not(.home):not(.library-page) > .masthead .top-nav{border:0;padding:0;gap:24px}.top-nav a{color:var(--ink);text-decoration:none}.top-nav a:hover{color:var(--lake);text-decoration:underline;text-decoration-thickness:1px}.story a:hover{text-decoration:underline}.hero{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:48px;align-items:start;padding-top:48px;padding-bottom:48px}.hero h1{max-width:780px;margin:0 0 16px}.hero .byline{margin-bottom:0}.hero h1 a,.story h3 a,.theme-card a{color:var(--ink);text-decoration:none}.hero-chart{display:block;color:var(--ink);text-decoration:none}.hero-title{display:block;margin:0 0 16px;white-space:nowrap}.bars{height:176px;display:flex;align-items:end;gap:8px;border-bottom:1px solid var(--ink)}.bars span{position:relative;background:var(--brick);flex:1}.bars b{position:absolute;bottom:100%;left:0;margin-bottom:4px;font:400 13px/1 Arial,sans-serif;color:var(--ink);white-space:nowrap}.bars span:last-child b{left:auto;right:0}.chart-caption{display:flex;justify-content:space-between;color:var(--stone);font-size:13px;margin-top:8px}.byline{font:400 15px/1.45 Arial,sans-serif;color:var(--stone)}.section{padding-top:48px;padding-bottom:64px}.section h2{margin-bottom:24px}.story{display:grid;grid-template-columns:104px 1fr;gap:24px;border-top:1px solid var(--rule);padding:24px 0}.story img{width:104px;height:104px;object-fit:cover;filter:grayscale(1);border:1px solid var(--rule)}.story h3{margin:4px 0 8px}.story p:not(.label){color:var(--stone);margin:0}.story.no-image>*{grid-column:2}.button{display:inline-block;border:1px solid var(--lake);padding:12px 20px;text-decoration:none;font:700 14px/1.45 Arial,sans-serif}.themes{background:var(--paper-wash)}.theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.theme-card h3{font-size:19px;line-height:1.25}.theme-card{border-top:4px solid var(--ink);padding-top:16px}.theme-card p{margin:12px 0}.signup{background:var(--paper);border-top:1px solid var(--rule);padding:48px 0}.signup-inner{display:grid;grid-template-columns:1fr 1fr;gap:48px}.signup h2{margin-bottom:12px}.signup p{color:var(--stone)}.signup form{display:flex;flex-direction:column;gap:8px}.signup-fields{display:flex;gap:8px}.signup input{flex:1;min-width:0;border:1px solid var(--stone);padding:12px 16px;font:16px Arial,sans-serif;background:var(--white);color:var(--ink)}button{border:0;background:var(--lake);color:var(--white);padding:12px 24px;font:700 14px Arial,sans-serif;cursor:pointer}button:disabled{opacity:.6}.footer{background:var(--ink);color:var(--paper);padding:48px 0 32px}.footer-inner{display:flex;justify-content:space-between;gap:48px}.footer-name{font:500 32px/1.15 'EB Garamond',serif;text-decoration:none;color:var(--paper)}.footer-name:hover{text-decoration:underline;text-decoration-thickness:1px}.footer-brand p{margin:8px 0 0}.footer-cols{display:flex;flex-wrap:wrap;gap:32px 64px}.footer-cols nav{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.footer-cols h3{font:500 19px/1.25 'EB Garamond',serif;color:var(--paper);margin:0 0 4px}.footer-cols a{font-size:15px;color:var(--paper);text-decoration:none}.footer-cols a:hover{text-decoration:underline}.footer-legal{margin:32px 0 0;padding-top:16px;border-top:1px solid var(--stone);font-size:13px;color:var(--pebble)}.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 240px;grid-template-rows:auto 1fr;gap:24px 40px;padding-top:48px;padding-bottom:64px}.article-head{margin-bottom:32px}.article-head h1{margin:12px 0 16px}.article-head .byline{margin-top:24px}.prose{max-width:700px;font:400 20px/1.5 'EB Garamond',serif;color:var(--ink)}.prose p{margin:0 0 24px}.prose strong,.prose b{font-weight:600}.prose .sources strong,.prose .chart strong,.prose .factbox strong{font-weight:700}.prose h2{margin:48px 0 24px}.prose h3{margin:32px 0 16px}.prose .q{font-weight:600;margin-top:32px}.guest-intro{display:flex;gap:24px;border-top:1px solid var(--rule);padding-top:24px;margin-top:24px}.guest-portrait{width:104px;height:120px;flex:none;background-size:cover;background-position:center;filter:grayscale(1);border:1px solid var(--rule)}.pf--jay{background-image:url('/assets/images/jay-bhattacharya.jpg')}.pf--vikas{background-image:url('/assets/images/vikas-goyal.jpg')}.pf--lovisa{background-image:url('/assets/images/lovisa-gustafsson.jpg')}.pf--nayyar,.pf--herzlinger,.pf--darrow{display:none}.gbody{font:400 16px/1.45 Arial,sans-serif;color:var(--stone)}.gbody p{margin:0 0 8px}.gname{font-weight:700;color:var(--ink)}.grole{display:block;font:400 13px/1.45 Arial,sans-serif;color:var(--stone)}.pull{font:400 24px/1.4 Arial,sans-serif;color:var(--lake);margin:32px 0}.pull cite{display:block;font:400 13px/1.45 Arial,sans-serif;color:var(--stone);margin-top:12px}.provenance,.sources{font:400 13px/1.45 Arial,sans-serif;color:var(--stone)}.article-aside{align-self:start;border-top:4px solid var(--lake);padding-top:16px;color:var(--stone)}.article-aside h2{color:var(--ink);font-size:22px;margin-bottom:12px}.chart,.factbox{background:var(--paper-wash);border-top:4px solid var(--brick);padding:24px;margin:32px 0;font:14px/1.5 Arial,sans-serif}.chart h3,.factbox h3{font-size:19px;line-height:1.25;margin:8px 0}.chart .sub,figcaption{color:var(--stone);font:13px/1.45 Arial,sans-serif}.row{display:grid;grid-template-columns:160px 1fr 64px;gap:12px;align-items:center;margin:16px 0}.bar-track{height:24px;background:var(--rule)}.bar{display:block;height:100%;background:var(--brick)}.row.other .bar{background:var(--pebble)}.time-chart{display:grid;grid-template-columns:32px 1fr;gap:8px}.time-axis{height:192px;display:flex;flex-direction:column;justify-content:space-between;font-size:11px}.time-bars{height:192px;display:grid;grid-template-columns:repeat(8,1fr);gap:8px;align-items:end;border-bottom:1px solid var(--rule)}.time-column{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.time-value{font-size:11px}.time-bar{height:var(--bar-height);width:min(100%,32px);background:var(--brick)}.time-years{display:grid;grid-template-columns:repeat(8,1fr);font-size:11px;text-align:center}.detail-note{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:16px 0;margin:32px 0}.detail-note summary{cursor:pointer;color:var(--lake);font:14px Arial,sans-serif}.detail-body{padding-top:16px}.sources{border-top:1px solid var(--rule);padding-top:24px;margin-top:48px}
@media(max-width:800px){h1{font-size:34px}h2{font-size:26px}.container{padding-left:16px;padding-right:16px}.masthead-inner{padding:24px 16px}.home .wordmark{font-size:48px}.home .masthead-art{display:none}body:not(.home):not(.library-page) > .masthead{flex-wrap:wrap;gap:16px;padding:16px}body:not(.home):not(.library-page) > .masthead .top-nav,.top-nav{gap:16px}.hero{grid-template-columns:1fr;gap:32px;padding-top:32px;padding-bottom:48px}.hero-chart{max-width:none}.hero-title{white-space:normal}.bars{height:150px}.section{padding-top:32px;padding-bottom:48px}.theme-grid,.signup-inner,.article-layout{grid-template-columns:1fr;gap:32px}.article-layout{padding-top:32px}.article-aside{max-width:700px}.footer-inner{flex-direction:column}.signup-fields{flex-wrap:wrap}.signup input{min-width:200px}.row{grid-template-columns:1fr auto}.row .bar-track{grid-column:1/-1;grid-row:2}.time-bars{gap:4px}.time-value,.time-years{font-size:11px}.story{grid-template-columns:80px 1fr;gap:16px}.story img{width:80px;height:80px}}

/* Give the publication's sections clear, alternating surfaces. */
body:not(.library-page){background:var(--white)}
.home .hero-band{background:var(--paper);border-bottom:1px solid var(--rule)}
.home .themes{background:var(--lake);color:var(--white)}
.home .theme-card{border-top-color:var(--white)}
.home .theme-card a{color:var(--white)}
body:not(.home):not(.library-page) .article-aside{background:var(--paper-wash);padding:24px;border-top:4px solid var(--lake)}
body:not(.home):not(.library-page) .signup{background:var(--lake);color:var(--white)}
body:not(.home):not(.library-page) .signup .label,body:not(.home):not(.library-page) .signup p{color:var(--white)}
body:not(.home):not(.library-page) .signup button{background:var(--white);color:var(--lake);border:1px solid var(--white)}
body:not(.home):not(.library-page) .signup a{color:var(--white)}

/* Index pages: a plain title, its deck, then the list. A lone article gets the lead treatment. */
main.section>h1{margin-bottom:12px}
main.section>.deck{margin-bottom:32px}
.lead-story{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:48px;border-top:1px solid var(--rule);padding-top:32px}
.lead-story h2{margin:0 0 12px}
.lead-story h2 a{color:var(--ink);text-decoration:none}
.lead-story h2 a:hover{text-decoration:underline;text-decoration-thickness:1px}
.lead-story .lead-deck{color:var(--stone);max-width:44em;margin:0 0 12px}
.lead-story .byline{margin:0}
@media(max-width:1000px){.footer-inner{flex-direction:column;gap:32px}}
@media(max-width:800px){.lead-story{grid-template-columns:1fr;gap:32px}}

/* The top bar stays in view on desktop. On the front page the large wordmark scrolls away and the menu row stays. */
@media(min-width:801px){
html{scroll-padding-top:96px}
body:not(.home):not(.library-page)>.masthead{position:sticky;top:0;z-index:30}
.home .masthead{position:sticky;top:-139px;z-index:30}
.home .wordmark{font-size:60px}
.home .top-nav .compact-wordmark{position:absolute;left:max(var(--page-gutter),calc((100% - var(--page-width))/2));top:50%;transform:translateY(-50%);font-size:24px;color:var(--lake);white-space:nowrap}
.home .top-nav .compact-wordmark[hidden]{display:none}
.hero,.lead-story{grid-template-columns:240px minmax(0,1fr);gap:40px}
.hero-title{white-space:normal}
.bars{height:150px}
body:not(.home):not(.library-page) .article-aside{padding:16px;font-size:14px}
body:not(.library-page) .footer-cols{column-gap:40px}
}

/* Article charts: no box, values on the columns, one line of source and caveat, the method folded. */
.chart{background:none;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);padding:16px 0}
.chart h3{margin:0 0 4px}
.chart .sub{margin:0 0 16px}
.chart figcaption{margin-top:12px}
.time-chart{display:block}
.time-bars{height:160px;border-bottom-color:var(--ink)}
.time-value{margin-bottom:4px;font-size:13px;white-space:nowrap}
.time-bar{width:100%}
.time-years{gap:8px;margin-top:4px;font-size:13px;color:var(--stone)}
.chart-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:4px 24px;margin-top:8px;font-size:13px}
.chart-foot details{flex:1 1 60%}
.chart-foot summary{width:fit-content;color:var(--stone);cursor:pointer;list-style:none}
.chart-foot summary::-webkit-details-marker{display:none}
.chart-foot summary::after{content:' \25BE'}
.chart-foot details[open] summary::after{content:' \25B4'}
.chart-foot details p{margin:8px 0 0;font:13px/1.45 Arial,sans-serif;color:var(--stone)}
.chart-foot a{white-space:nowrap}
@media(max-width:800px){.time-bars,.time-years{gap:4px}.time-value,.time-years{font-size:11px}}

/* The publication reads narrower than the Library, whose tools need the room. */
body{--page-width:880px}
/* Lead headlines stay on two lines in the narrower page; the reading column gets its full width before the side note grows. */
.hero h1{font-size:clamp(34px,2.8vw,36px)}
.article-head h1{font-size:clamp(34px,3.3vw,42px)}
.article-aside{justify-self:end;width:100%;max-width:320px}
@media(max-width:800px){.hero h1,.article-head h1{font-size:34px}}
/* In the narrower page the article's side note moves under the text before the reading column gets too thin. */
/* Article sidebar: the note, then a sign-up box with other reading that follows the reader down the page. */
.article-layout>main{grid-row:1/span 2}
.article-layout>.article-aside{grid-column:2;grid-row:1}
.rail-box{grid-column:2;grid-row:2;align-self:start;position:sticky;top:96px;max-height:calc(100vh - 112px);overflow:auto;font-size:14px;color:var(--stone)}
.rail-box form{background:var(--paper-wash);border-top:4px solid var(--lake);padding:16px}
.rail-box h2{margin:0 0 8px;font-size:19px;line-height:1.25;color:var(--ink)}
.rail-box p{margin:0 0 12px}
.rail-box .label{display:block;margin:0 0 4px}
.rail-box input{display:block;width:100%;border:1px solid var(--stone);padding:8px 12px;background:var(--white);color:var(--ink);font:14px Arial,sans-serif}
.rail-box button{display:block;width:100%;margin-top:8px;padding:8px 12px}
.rail-box .rail-status{margin:8px 0 0;font-size:13px}
.rail-box .rail-status:empty{display:none}
.rail-next{margin-top:16px}
.rail-next .label{margin:0}
.rail-next ul{list-style:none;margin:0;padding:0}
.rail-next li{margin:12px 0 0}
.rail-next a{display:block;color:var(--ink);text-decoration:none;font:500 19px/1.25 'EB Garamond',serif}
.rail-next a:hover{text-decoration:underline;text-decoration-thickness:1px}
.rail-next span{display:block;margin-bottom:2px;font:400 12px/1.4 Arial,sans-serif;color:var(--stone)}
@media(max-width:1000px){
.article-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:none;gap:32px}
.article-layout>main,.article-layout>.article-aside,.rail-box{grid-column:1;grid-row:auto}
.article-aside,.rail-box{max-width:700px;justify-self:start}
.rail-box{position:static;max-height:none;overflow:visible;width:100%}
.rail-box form{display:none}
.rail-next{margin-top:0;padding-top:0;border-top:0}
}

/* The wordmark's tight tracking lets its last letter run past the milestone line; the line now spans the whole name. */
.wordmark>span:first-child{padding-right:.06em}

/* Smaller screens: the menu folds behind a hamburger button. */
.nav-toggle,.nav-button{display:none}
@media(max-width:800px){
.masthead{position:relative}
.nav-toggle{display:block;position:absolute;width:1px;height:1px;margin:0;opacity:0}
.nav-button{display:flex;flex-direction:column;justify-content:center;gap:5px;position:absolute;top:16px;right:6px;width:44px;height:44px;padding:0 10px;cursor:pointer}
.nav-button span{display:block;height:2px;background:var(--ink);transition:transform .15s,opacity .15s}
.nav-toggle:focus-visible+.nav-button{outline:2px solid var(--lake);outline-offset:-2px}
.nav-toggle:checked+.nav-button span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle:checked+.nav-button span:nth-child(2){opacity:0}
.nav-toggle:checked+.nav-button span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.top-nav{display:none;flex:0 0 100%}
.nav-toggle:checked~.top-nav{display:flex;flex-direction:column;align-items:stretch;gap:0!important;padding:0;border:0}
.nav-toggle:checked~.top-nav a{display:block;padding:12px 0;border-top:1px solid var(--rule);font-size:16px}
.home .masthead{border-bottom:1px solid var(--rule)}
.home .masthead-inner{justify-content:flex-start}
.home .nav-button{top:32px}
.home .nav-toggle:checked~.top-nav{padding:0 16px}
}

/* Give linked text consistent feedback without changing the wordmark. */
a:not(.wordmark):not(.hero-chart):hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.hero-chart:hover .hero-title{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}

/* Beige only behind the sign-up form: the sidebar note sits on the page, under a hairline. */
body:not(.home):not(.library-page) .article-aside{background:none;padding:12px 0 0;border-top:1px solid var(--rule)}

/* Bylines are black and link to the author's profile. */
.byline{color:var(--ink)}
.byline a{color:inherit;text-decoration:none}
.byline a:hover{text-decoration:underline;text-decoration-thickness:1px}
/* The author bio that closes each piece. */
.author-bio{display:grid;grid-template-columns:88px minmax(0,1fr);gap:20px;max-width:700px;margin-top:40px;padding-top:24px;border-top:1px solid var(--rule)}
.author-bio.no-photo{grid-template-columns:minmax(0,1fr)}
.author-photo{display:block;width:88px;height:88px}
.author-photo img,.author-head img{display:block;object-fit:cover;filter:grayscale(1);border:1px solid var(--rule)}
.author-photo img{width:88px;height:88px}
.author-bio .label{margin:0 0 4px}
.author-bio h2{margin:0 0 8px;font-size:22px;line-height:1.2}
.author-bio h2 a{color:var(--ink);text-decoration:none}
.author-bio h2 a:hover{text-decoration:underline;text-decoration-thickness:1px}
.author-bio p:not(.label){margin:0 0 8px;font:400 15px/1.5 Arial,sans-serif;color:var(--stone)}
.author-more{font:400 14px/1.45 Arial,sans-serif}
/* Author profile pages. */
.author-head{display:flex;align-items:center;gap:24px;margin-bottom:24px}
.author-head img{width:120px;height:120px;flex:none}
.author-page .author-head h1{margin:0 0 4px}
.author-head .deck{margin:0}
.author-about{max-width:640px;margin-bottom:16px}
.author-page>h2{margin:32px 0 8px}
.story.text-only{grid-template-columns:minmax(0,1fr)}

/* Editorial index features: scoped to the publication's listing pages. */
.editorial-index .index-kicker{margin-bottom:12px}
.editorial-index a{color:inherit;text-decoration:none}
.editorial-index a:hover{text-decoration:underline}
.editorial-index .editorial-link{display:inline-block;color:var(--lake);font:700 14px/1.45 Arial,sans-serif;margin-top:16px}
.editorial-link span{margin-left:8px}
.interview-feature{display:grid;grid-template-columns:140px minmax(0,1fr);gap:8px;align-items:center;background:var(--paper);padding:24px 0 24px 24px}
.interview-feature img{width:140px;height:140px;object-fit:cover;filter:grayscale(1);mix-blend-mode:multiply}
.interview-feature-copy{padding:24px 32px;align-self:center}
.interview-feature-copy .label,.article-feature-copy .label{margin:0 0 12px}
.interview-feature-copy h2,.article-feature-copy h2{margin:0 0 12px}
.interview-feature-copy>p:not(.label),.article-feature-deck{color:var(--stone);margin:0}
.interview-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:32px}
.interview-card{border-top:1px solid var(--rule);padding-top:16px;min-width:0}
.interview-card-heading{display:flex;justify-content:space-between;gap:12px;align-items:start;margin-bottom:16px}
.interview-card-heading .label{margin:0}
.interview-card-heading time{font-size:11px;white-space:nowrap;color:var(--stone)}
.interview-card-content{display:grid;grid-template-columns:80px minmax(0,1fr);gap:16px}
.interview-card-content img{width:80px;height:80px;object-fit:cover;filter:grayscale(1)}
.interview-card-content h3{margin:0 0 8px}
.interview-card-content p{font-size:14px;line-height:1.5;color:var(--stone);margin:0}
.interview-archive{margin-top:48px}.interview-archive>h2{margin-bottom:24px}
.interview-archive .story.no-image{grid-template-columns:minmax(0,1fr)}
.interview-archive .story.no-image>div{grid-column:1}
.article-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);background:var(--paper-wash)}
.article-feature-copy{padding:32px}.article-feature-copy .byline{margin:16px 0 0}
.article-feature-chart{background:var(--paper);padding:32px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.article-feature-chart .label{margin:0}.article-feature-chart .bars{height:144px}.article-feature-chart .bars b{font-size:12px}
.article-feature-chart .chart-caveat{font-size:11px;line-height:1.45;color:var(--stone);margin:0}
@media(max-width:800px){.interview-feature{grid-template-columns:120px minmax(0,1fr)}.interview-feature img{width:120px;height:120px}.interview-feature-copy{padding:24px}.interview-grid{gap:24px}.article-feature-copy,.article-feature-chart{padding:24px}}
@media(max-width:620px){.interview-feature{grid-template-columns:1fr}.interview-feature{padding:24px 24px 0}.interview-feature img{width:120px;height:120px;object-position:center top}.interview-grid,.article-feature{grid-template-columns:1fr}.interview-card-content{grid-template-columns:80px minmax(0,1fr)}.article-feature-chart{min-height:260px}.interview-archive{margin-top:32px}}

/* Article and interview body section headings. */
.prose > h2,.prose > h3{font-family:Arial,sans-serif;font-weight:700}
/* Review pass, 2026-11-06. */
/* The sign-up band's two labels match. */
.signup .label{color:var(--lake)}
/* Body section headings in sans serif need less size than the serif headings they replaced. */
.prose>h2{margin:40px 0 16px;font-size:24px;line-height:1.25}
.prose>h3{margin:32px 0 12px;font-size:19px;line-height:1.3}
/* Legal pages: the date is a caption under the title. */
.updated{margin:0 0 24px;font:400 13px/1.45 Arial,sans-serif;color:var(--stone)}
/* Portraits on white keep their edge, and a date sits close to its headline. */
.interview-card-content img{border:1px solid var(--rule)}
.story .label{margin-bottom:4px}
/* The page that shows for an address that does not exist. */
.not-found{min-height:max(360px,calc(100vh - 380px))}
.not-found-links{display:flex;flex-wrap:wrap;gap:12px 24px;margin:0;padding:0;list-style:none;font:400 15px/1.45 Arial,sans-serif}
/* Every table opens with a rule above its top row and a hairline below it. */
table>thead>tr:first-child>*,table>tbody:first-child>tr:first-child>*{box-shadow:inset 0 1px 0 var(--ink),inset 0 -1px 0 var(--rule);padding-top:8px;padding-bottom:8px}

/* The parts of a long article. Every article and interview uses these; no piece has its own stylesheet. */
.prose blockquote{font:400 24px/1.4 Arial,sans-serif;color:var(--lake);margin:32px 0;padding:0}
.prose hr{border:0;border-top:1px solid var(--rule);margin:32px 0}
.story-image{margin:32px 0;max-width:320px}
.story-image img{display:block;width:100%;height:auto}
.story-image figcaption{margin-top:12px;font:400 13px/1.5 Arial,sans-serif;color:var(--stone)}
.prose>.chapter-number{margin:48px 0 8px;padding-top:24px;border-top:1px solid var(--rule);font:400 13px/1.4 Arial,sans-serif;color:var(--stone);scroll-margin-top:150px}
.prose>.chapter-number+h2{margin-top:0}
.chapter-summary{margin:0 0 24px;padding-bottom:16px;border-bottom:1px solid var(--rule);font:400 16px/1.5 Arial,sans-serif;color:var(--stone)}
.chapter-summary ul{margin:0;padding-left:20px}
.chapter-summary li{margin:8px 0}
.chart-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin:8px 0 16px;font:400 13px/1.45 Arial,sans-serif;color:var(--stone)}
.chart-legend span{display:flex;align-items:center;gap:8px}
.chart-legend i{display:inline-block;width:12px;height:12px}
.chart-legend .baseline,.row .bar.baseline{background:var(--data-blue)}
.chart-legend .additional,.row .bar.additional{background:var(--amber)}
.bar-track.stacked{display:flex}
.case-list,.term-list,.cost-map{margin:32px 0;padding:16px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);font:400 14px/1.5 Arial,sans-serif}
.case-list h3,.term-list h3,.cost-map h3{margin:0 0 16px;font:500 19px/1.25 'EB Garamond',Georgia,serif}
.case-list p,.term-list p{margin:0;font:400 14px/1.5 Arial,sans-serif}
.case-list .label{margin:0 0 8px}
.case-list ul{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin:0;padding:0;list-style:none}
.case-list li{padding:16px 0;border-top:1px solid var(--rule)}
.term-list details{padding:16px 0;border-top:1px solid var(--rule)}
.term-list details:last-child{padding-bottom:0}
.term-list summary{font:700 14px/1.5 Arial,sans-serif;cursor:pointer;list-style:none}
.term-list summary::-webkit-details-marker{display:none}
.term-list summary::after{content:' \25BE'}
.term-list details[open] summary::after{content:' \25B4'}
.term-list summary .label{display:block;margin-bottom:4px;font-weight:400;color:var(--stone)}
.term-list details p{padding-top:12px}
.cost-map>.label{margin:0 0 16px}
.cost-map ul{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0;padding:0;list-style:none}
.cost-map li{padding-left:12px;border-left:2px solid var(--rule)}
.cost-map li.patient{border-left-style:dashed}
.contributor-note{margin:32px 0 16px;font:400 13px/1.5 Arial,sans-serif;color:var(--stone)}
.contributor-note p{margin:0;font:inherit;color:inherit}
.contributor-note .label{margin:0 0 8px}
.contributor-note b{color:var(--ink)}
.pf--levin{background-image:url('/assets/images/jeremy-levin.jpg')}
@media(max-width:600px){.case-list ul{grid-template-columns:1fr}.story-image{max-width:100%}}
/* The current section is marked in the top menu. */
.top-nav a[aria-current]{font-weight:700}
/* The front page's one list of the latest pieces. */
.latest-links{display:flex;flex-wrap:wrap;gap:16px;margin:24px 0 0}

/* The shared footer uses the firm’s full wordmark. */
.footer-company-logo img{display:block;width:150px;max-width:100%;height:auto}

/* Sharing controls stay compact and legible beside the article and in its reading rail. */
.article-share{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font:400 13px/1.3 Arial,sans-serif;color:var(--stone)}
.article-share-label{font-weight:700;color:var(--ink);margin-right:4px}
.article-share .article-share-action{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:none;margin:0;padding:8px;border:1px solid var(--lake);background:transparent;color:var(--lake);text-decoration:none}
.article-share .article-share-action:hover{background:var(--lake);color:var(--white);text-decoration:none}
.article-share svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.article-share svg .share-fill{fill:currentColor;stroke:none}
.article-share-status{font-size:12px;color:var(--stone)}
.article-share-status:empty{display:none}
.article-share--top{margin-top:16px}
.article-share--bottom{max-width:700px;margin-top:32px;padding-top:16px;border-top:1px solid var(--rule)}
.article-share--rail{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--rule)}
@media(max-width:1000px){.article-share--rail{margin-top:0}}

/* Compact the shared article opening while retaining separation from navigation. */
.article-layout{padding-top:24px}
.article-head h1{margin-top:0}
@media(max-width:800px){.article-layout{padding-top:24px}}

/* Sign-up benefits use the publication's square milestone marks. */
.signup-benefits{list-style:none;margin:0 0 16px;padding:0;color:var(--stone);font:400 15px/1.45 Arial,sans-serif}
.signup-benefits li{position:relative;padding-left:16px;margin:0 0 8px}
.signup-benefits li:last-child{margin-bottom:0}
.signup-benefits li::before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;background:var(--lake)}
.signup-benefits a{color:var(--lake);text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
body:not(.home):not(.library-page) .signup .signup-benefits{color:var(--white)}
body:not(.home):not(.library-page) .signup .signup-benefits li::before{background:#a6cad5}
.rail-box .signup-benefits{font-size:14px;margin:0 0 16px}

/* Front-page flourishes (Henri, November 8). Built from The Milestone's own marks, never a competitor's.
   The lead story takes the share-card form: headline on lake, chart on paper, both inside the body width, white either side. */
@media(min-width:801px){
.home .hero-band{background:var(--white);border-bottom:0}
.home .hero{position:relative;isolation:isolate;grid-template-columns:minmax(0,1fr) 288px;gap:0}
.home .hero>div{order:1;padding:0 32px 0 40px}
.home .hero-chart{order:2;padding:0 24px}
.home .hero::before,.home .hero::after{content:"";position:absolute;z-index:-1;top:0;bottom:0}
.home .hero::before{left:var(--page-gutter);right:calc(var(--page-gutter) + 288px);background:var(--lake)}
.home .hero::after{right:var(--page-gutter);width:288px;background:var(--paper)}
.home .hero h1 a{color:var(--white)}
.home .hero .deck{color:#D5E0E3}
.home .hero .byline,.home .hero .byline a{color:var(--white)}
}
/* The milestone track at large scale along the foot of the Themes band, its squares cut by the edge. */
.home .themes{background:var(--lake) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='72'%3E%3Cg stroke='%23396B7C' stroke-width='2' fill='%231F4B5B'%3E%3Cline x1='0' x2='100%25' y1='60' y2='60'/%3E%3Crect x='14%25' y='39' width='42' height='42'/%3E%3Crect x='47%25' y='39' width='42' height='42'/%3E%3Crect x='80%25' y='39' width='42' height='42' fill='%23396B7C'/%3E%3C/g%3E%3C/svg%3E") left bottom/100% 72px no-repeat}
.home .themes .section{padding-bottom:80px}

/* Articles and interviews: a Garamond initial in lake opens the piece; the wordmark's filled square closes it.
   The build marks the last body paragraph with class "end". */
.prose>p:first-child:not([class])::first-letter{float:left;font:500 92px/.78 'EB Garamond',serif;color:var(--lake);margin:7px 10px 0 -2px}
.prose>p.end::after{content:"";display:inline-block;width:.42em;height:.42em;background:var(--lake);margin-left:.45em;vertical-align:.04em}

/* Phones: one thin bar on every Milestone page, fixed at the top (Henri, November 8). About 60px, like the Library's compact bar. */
@media(max-width:800px){
html{scroll-padding-top:72px}
body:not(.library-page)>.masthead{position:sticky;top:0;z-index:30}
.home .masthead-inner{padding:8px 16px}
body:not(.home):not(.library-page)>.masthead{padding:8px 16px}
.home .wordmark,body:not(.library-page)>.masthead .wordmark{font-size:28px}
.home .nav-button,body:not(.library-page)>.masthead .nav-button{top:8px}
.top-nav .compact-wordmark{display:none!important}
}
