@font-face{font-family:Space Grotesk;src:url(fonts/space-grotesk.ttf) format('truetype');font-weight:300 700;font-display:swap}
:root{--paper:#f7f7f4;--wash:#ededea;--ink:#24232b;--blue:#5145cd;--muted:#62616a;--line:#d4d3d7;--sans:'Space Grotesk',Arial,sans-serif;--carbon:#191820;--iris:#b5afff;--citron:#d7f59a}
body{background:var(--paper)}
.masthead,.index-introduction{background:var(--carbon);color:var(--paper)}
.masthead{position:sticky;top:0;z-index:20}
.masthead-inner{min-height:76px;padding-block:12px}
.masthead .brand{color:var(--paper);font:500 27px/1 var(--sans);letter-spacing:-1.3px;gap:12px}
.masthead .brand img{width:32px;height:38px;padding:0;border-radius:0;background:none}
.wordmark-amp{color:var(--iris);font-weight:400;margin:0 2px}
.masthead .primary-nav>a,.masthead .essays-toggle{color:#f7f7f4;font-family:var(--sans)}
.masthead a:focus-visible,.masthead button:focus-visible{outline-color:var(--citron)}
.index-introduction{padding:46px 0 54px;position:relative;top:0}
.modern-kicker{font:400 11px/1.6 var(--sans);letter-spacing:.08em;text-transform:uppercase}
.index-introduction .modern-kicker{color:var(--iris);margin-bottom:18px}
.index-introduction h1{font:400 clamp(36px,4.8vw,64px)/1.05 var(--sans);letter-spacing:-.055em;max-width:900px;text-wrap:initial}
.reading-area{background:var(--paper);padding-top:32px}
.reading-index{gap:36px}
.reading-unit{border:0;border-bottom:1px solid var(--line);background:transparent}
.reading-link{position:relative;display:block;padding:25px 44px 28px 16px}
.reading-index .reading-copy h2{font:500 25px/1.14 var(--sans);letter-spacing:-.04em;text-wrap:initial;max-width:28ch}
.reading-index .reading-deck{font:400 16px/1.55 var(--sans);margin-top:14px;max-width:47ch}
.reading-index .reading-attribution,.reading-index .reading-state{font:400 11px/1.5 var(--sans)}
.story-number{position:absolute;right:10px;top:29px;font:400 11px/1 var(--sans);color:var(--muted)}
.continuing-column{gap:6px}
.reading-link:hover{background:#e6e5ec;color:var(--ink)}
.reading-unit--featured{background:var(--carbon);color:var(--paper);border:0;top:94px}
.reading-unit--featured .reading-link{padding:30px 30px 12px;display:block}
.reading-unit--featured .modern-kicker{color:var(--iris);margin-bottom:18px}
.reading-index .reading-unit--featured h2{font:400 clamp(28px,3vw,42px)/1.08 var(--sans);letter-spacing:-.055em}
.reading-index .reading-unit--featured .reading-deck{font:400 15px/1.55 var(--sans);color:#cbcad2;margin-top:18px}
.reading-unit--featured .reading-link:hover{color:var(--paper);background:#25232f}
.intro-link{display:block;margin-top:18px;font:400 13px/1.5 var(--sans);color:var(--iris)}
.motion-study{margin:0;padding:0 24px 24px}
.motion-stage{position:relative;aspect-ratio:1.5;overflow:hidden;touch-action:pan-y;cursor:grab}
.motion-stage:active{cursor:grabbing}
.motion-stage canvas,.motion-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.motion-stage canvas{display:none}.motion-study.ready canvas{display:block}.motion-study.ready .motion-fallback{visibility:hidden}
.motion-controls{display:none;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #494652;padding-top:5px}
.motion-study.ready .motion-controls{display:flex}
.motion-controls button{font:400 11px/1.4 var(--sans);color:#eee;background:none;border:0;min-height:44px;padding:5px 0;cursor:pointer}
.motion-controls label{display:flex;align-items:center;gap:10px;color:#cbc8d6;font:400 10px/1.4 var(--sans)}
.motion-turn{width:90px;accent-color:var(--iris);min-height:44px}
.motion-controls :focus-visible{outline:2px solid var(--citron);outline-offset:4px}
.motion-study figcaption strong{display:block;font:400 16px/1.4 var(--sans);color:var(--citron);margin:10px 0}
.motion-study figcaption span{display:block;font:400 11px/1.5 var(--sans);color:#c0bdc9;max-width:45ch}
.footer-field{background:#ededea}.publication-disclaimer p{font:400 17px/1.55 var(--sans)}
.publication-footer,.publication-disclaimer h2{font-family:var(--sans)}
.about-opening h1,.about-prose h2,.about-name h2,.about-author h2{font-family:var(--sans);letter-spacing:-.04em}
.about-author>a{font-family:var(--sans)}
.about-cover.modern-cover{border:0;padding:0;background:var(--carbon)}
.about-cover.modern-cover>img{width:100%;height:auto;padding:0;border:0;border-radius:0;background:transparent;margin:0;box-sizing:border-box}
.identity-invitation{padding-block:70px;max-width:936px}
.identity-invitation h2{font:400 38px/1.1 var(--sans);letter-spacing:-.04em;margin:20px 0}
.identity-invitation p:not(.modern-kicker){font:16px/1.6 var(--sans);margin:20px 0}
.identity-invitation a{color:var(--blue);font:14px var(--sans)}
.essay-opening{background:var(--carbon);color:var(--paper)}
.title-field h1{font-family:var(--sans);font-size:clamp(36px,5vw,68px);font-weight:400;letter-spacing:-.055em}
.title-field h1 em{color:var(--iris);font-style:normal}
.essay-deck{color:#d0ccd9;font-family:var(--sans);font-size:20px}
.opening-art{background:var(--carbon)}.opening-art img{object-fit:contain}
.prose h2,.inspection-copy h2,.figure-heading h2{font-family:var(--sans)}
.identity-modern{max-width:1104px;margin:auto;padding-inline:24px}
.studio-opening{padding:80px 0 100px;max-width:850px}
.studio-opening h1{font:400 clamp(48px,6vw,80px)/1.03 var(--sans);letter-spacing:-.065em;margin:24px 0;max-width:none}
.studio-opening p:not(.modern-kicker){font:20px/1.5 var(--sans);max-width:40ch;margin-bottom:28px}
.identity-modern a{color:var(--blue);font:14px/1.5 var(--sans);text-decoration:underline;text-underline-offset:4px}
.studio-section{padding:64px 0;border-top:1px solid var(--line)}
.studio-section>h2{font:400 40px/1.1 var(--sans);letter-spacing:-.05em;margin:18px 0 30px}
.studio-section>p:not(.modern-kicker){max-width:75ch;font:17px/1.65 var(--sans);margin-block:18px}
.mark-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}
.mark-specimen{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:1.3;background:var(--carbon);margin-bottom:22px}
.mark-specimen span{position:absolute;bottom:16px;left:16px;color:var(--iris);font:11px var(--sans)}
.mark-options h3{font:500 24px var(--sans);margin-bottom:12px}
.mark-options p{font:14px/1.65 var(--sans);margin-block:12px}
.mark-options p.concept{font-size:17px}.mark-options p.small{font-size:12px;color:var(--muted)}
.recommendation{background:#e8e5fc;margin-top:44px;padding:32px}.recommendation h3{font:28px/1.2 var(--sans);margin:15px 0}.recommendation p:last-child{max-width:75ch;font:16px/1.6 var(--sans)}
.notation-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:36px}
.notation-grid svg{color:var(--blue);margin-bottom:16px}.notation-grid h3{font:500 16px var(--sans);margin:8px 0}.notation-grid p{font:14px/1.5 var(--sans);color:var(--muted)}
.grammar-demo{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-block:50px;gap:20px}
.grammar-demo>div{border-top:2px solid var(--blue);padding-top:25px;position:relative}
.grammar-demo>div:nth-child(2):before{content:'';position:absolute;top:-15px;left:0;width:3px;height:30px;background:var(--blue)}
.grammar-demo .open-finding{border-top-style:dashed;border-color:var(--muted)}
.grammar-demo small,.placement-grid small{font:11px var(--sans);text-transform:uppercase;letter-spacing:.06em}
.grammar-demo strong{display:block;font:500 19px/1.25 var(--sans);margin:12px 0}.grammar-demo span{font:14px/1.5 var(--sans)}
.placement-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}.placement-grid h3{font:28px/1.2 var(--sans);margin:15px 0}.placement-grid p{font:16px/1.6 var(--sans);margin-bottom:15px}
.swatches{display:grid;grid-template-columns:repeat(4,1fr);margin:32px 0}.swatches span{padding:40px 20px;font:14px/1.6 var(--sans);color:var(--ink)}
.studio-footer{display:flex;justify-content:space-between;gap:20px;padding:40px 5vw;background:var(--carbon);color:var(--paper);font:14px var(--sans)}
@media(max-width:1000px){.reading-unit--featured .reading-link{padding:24px 20px 10px}.motion-study{padding-inline:18px}.reading-index .reading-copy h2{font-size:22px}.reading-index .reading-unit--featured h2{font-size:32px}.motion-controls label{gap:5px}.motion-turn{width:66px}}
@media(max-width:760px){.reading-index{display:block}.reading-unit--featured{position:static}.reading-unit--featured .reading-link{padding:28px 24px 10px}.motion-stage{aspect-ratio:1.45}.reading-link{padding:24px 30px 28px 8px}.reading-index .reading-copy h2{font-size:25px}.reading-index .reading-deck{font-size:17px}.reading-index .reading-attribution,.reading-index .reading-state{font-size:12px}.index-introduction{padding-block:28px 40px}.index-introduction h1{font-size:40px}.masthead .brand{font-size:25px}.mark-options{grid-template-columns:1fr 1fr}.notation-grid{grid-template-columns:1fr 1fr}.grammar-demo{grid-template-columns:1fr 1fr;gap:38px}.studio-opening{padding-block:50px}.studio-section>h2{font-size:32px}.swatches{grid-template-columns:1fr 1fr}.studio-footer{flex-direction:column}.placement-grid{grid-template-columns:1fr}}
@media(max-width:460px){.mark-options{grid-template-columns:1fr}.grammar-demo{grid-template-columns:1fr}.studio-opening h1{font-size:48px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Inline publication signature matches the masthead at paragraph scale. */
.inline-wordmark{font-family:var(--sans);font-weight:500;letter-spacing:-.048em;white-space:nowrap;color:var(--ink)}
.inline-wordmark .wordmark-amp{color:var(--blue);margin:0 .025em;font-weight:400}

.reading-unit--featured .inline-wordmark{color:var(--paper)}
.reading-unit--featured .inline-wordmark .wordmark-amp{color:var(--iris)}

/* Keep the homepage introduction and wordmark on one line. */
.reading-unit--featured .reading-copy{container-type:inline-size}
.reading-index .reading-unit--featured #intro-title{font-size:clamp(20px,7.6cqi,38px);white-space:nowrap}

.reading-unit--contributors .reading-link{height:auto;padding-bottom:18px;}
.reading-credits{padding:0 44px 28px 16px;}
.reading-credits .reading-attribution{padding-top:0;margin-top:0;}
.reading-contributors{font:400 12px/1.65 var(--sans);color:var(--muted);margin-top:7px;}
.reading-contributors a{text-decoration:underline;text-underline-offset:3px;}
.reading-credits .reading-state{margin-top:8px;}
@media(max-width:760px){.reading-credits{padding-inline:8px 30px;}}

/* Keep the fourth story and its independently linked credits in one hover field. */
.reading-unit--contributors:hover,
.reading-unit--contributors:focus-within{background:#e6e5ec;}
.reading-unit--contributors .reading-link:hover{background:transparent;}

/* Size-aware sticky feature: no clipped caption or nested scrolling. */
.reading-index .reading-unit--featured { position:static; }
@media (min-width:761px) {
  .reading-index .reading-unit--featured.fits-viewport { position:sticky; top:var(--feature-top,94px); }
  .reading-unit--featured.fits-viewport .motion-stage { height:var(--feature-art-height); aspect-ratio:auto; }
}
@media print { .reading-index .reading-unit--featured.fits-viewport { position:static; } }