/* Editorial revision: Nubank-inspired discovery, Atlas-inspired reading. */
body{background:#fff}.intro{grid-template-columns:1fr 1fr;padding-block:32px;gap:32px}.intro h1{font-size:64px}.intro>div{text-align:right}.intro p{margin:0;font-size:14px;max-width:none}.feature{grid-template-columns:repeat(12,minmax(0,1fr));gap:0;padding-block:0 72px;align-items:center;isolation:isolate}.feature-copy{grid-column:1/7;grid-row:1;z-index:2;background:var(--paper);padding:42px 46px 42px 0;margin-block:48px}.feature h2{font-size:clamp(38px,3.8vw,56px);max-width:15ch}.feature h2 br{display:none}.feature-copy>p{max-width:41ch;font-size:15px}.feature .meta{margin-bottom:18px;flex-wrap:wrap}.feature .context-art{grid-column:5/-1;grid-row:1;min-height:580px;background:#dfeaff;padding:30px 30px 30px 27%;}.feature .context-stack{width:270px;height:330px}.feature .sheet{padding:30px}.feature .sheet strong{font-size:35px}.feature .sheet img{width:40px;height:40px;margin-bottom:24px}.feature .sheet span{font-size:14px}.feature .art-top{font-size:13px}.feature .art-bottom{border-color:#abc3ee;font-size:12px;max-width:340px;width:100%}.feature .read-link{background:var(--blue);color:white;padding:13px 23px;border-radius:28px;min-height:48px;margin-top:25px;gap:30px}.feature .read-link:hover{background:#0057f6;gap:30px}.feature .byline .avatar-image{width:48px;height:48px}.archive{border:0;padding-top:10px}.section-head h2{font-size:40px}.discovery{margin-top:30px;border-block:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:24px}.filters{margin:0;border:0;gap:25px}.filters button{padding-block:22px;font-size:13px}.format-filter{font-size:12px;color:var(--muted);display:flex;gap:12px;align-items:center}.format-filter select{font:13px Inter,sans-serif;border:0;background:#f2f5f9;padding:10px 26px 10px 12px;color:var(--ink);max-width:180px}.format-filter select:focus-visible{outline:3px solid var(--blue);outline-offset:3px}#article-list{display:grid;grid-template-columns:1.25fr 1fr;gap:0 46px;padding-top:12px}.article-row{grid-template-columns:1fr 108px;gap:15px 24px;padding:28px 0}.row-category{grid-column:1/-1;display:flex;gap:18px;align-items:center;color:var(--link);font-weight:600;padding:0}.row-category span{font-weight:400;color:var(--muted);font-size:12px}.article-row h3{font-size:28px}.article-row p{font-size:14px}.article-row .row-art{min-height:108px;margin-top:0}.article-row .row-meta{line-height:1.8}.article-row:first-child{grid-row:span 2;display:flex;flex-direction:column;align-items:stretch;padding-top:28px;border-bottom:0}.article-row:first-child .row-art{order:-1;min-height:230px;margin-bottom:15px}.article-row:first-child .row-art svg{width:120px;height:120px}.article-row:first-child .row-art img{width:90px;height:90px}.article-row:first-child h3{font-size:34px;max-width:26ch}.authors{background:#f5f7fa}.author-grid>a{display:grid;grid-template-rows:80px auto auto auto;align-items:center}.author-grid .large{width:80px;height:80px;font-size:24px;background:#e6edfa}.author-grid .author-avatar{background:none}.author-grid h3{align-self:end}.author-grid p{align-self:start}.closing{padding-block:70px}.footer{background:white}
/* Shared alignment: a quiet left rail and a 740px reading column. */
body[data-page='article'] .article-heading{width:min(calc(100% - 48px),1120px);max-width:none;padding:58px 0 52px 300px}.article-heading h1{font-size:60px;line-height:1.08;max-width:21ch;font-weight:450;letter-spacing:-.035em}.article-heading .breadcrumb{margin-bottom:25px}.article-heading .deck{font-size:19px;line-height:1.7;margin-top:24px;max-width:62ch}.article-tools{display:flex;align-items:center;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--muted);margin-top:25px}.article-tools .copy-button{margin-left:auto}.article-meta{display:block;border-block:1px solid #dce1e7;margin-top:32px;padding:0;min-height:156px}.article-meta .byline{position:relative;display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;padding:24px 26px;gap:24px;min-height:156px}.article-meta .byline>div{flex:1}.article-meta .byline .initial{width:112px;height:112px;flex:none;font-size:32px;align-self:center;background:#edf3ff}.article-meta .byline .avatar-image{background:none;border-radius:0;width:132px;height:132px;margin:-10px 0}.article-meta #author-name{font:500 25px/1.2 Outfit,sans-serif}.author-role{display:block;font-size:13px;color:var(--muted);margin-top:10px}.article-meta small{margin-top:4px;font-size:12px;color:var(--link)}.reading-layout{width:min(calc(100% - 48px),1120px);padding:0 0 68px;border:0;grid-template-columns:220px minmax(0,820px);gap:80px}.reading-layout aside{top:32px;padding-top:0;font-size:13px}.rail-title{font:500 38px/1 Outfit,sans-serif;text-decoration:none}.rail-title span{color:var(--blue)}.rail-description{font-size:12px;color:var(--muted);line-height:1.7;margin:17px 0 32px}.reading-layout summary{border-top:1px solid var(--line);padding-top:20px;font-size:13px}.reading-layout aside nav{gap:17px}.reading-layout aside nav a{line-height:1.5;padding-left:12px;border-left:1px solid #d5dce5}.reading-layout aside nav a:hover{border-color:var(--blue)}.prose{font-size:19px;line-height:1.9;max-width:67ch}.prose h2{font-size:34px;margin-top:55px;margin-bottom:24px;font-weight:450;letter-spacing:-.025em}.prose p{margin-bottom:26px}.prose blockquote{font-size:34px;line-height:1.4;letter-spacing:-.025em;padding-block:32px;margin:42px 0;color:var(--ink)}.prose blockquote:before{content:'“';display:block;color:var(--blue);font:500 56px/.7 Outfit,sans-serif;margin-bottom:12px}.prose .editor-note{background:#f4f6fa;border:1px solid #e0e5ed;font-size:12px;padding:18px 24px}.article-author{max-width:820px;width:calc(100% - 48px);margin:0 max(24px,calc((100% - 1120px)/2)) 65px auto;padding-top:28px}.article-author .initial{width:64px;height:64px}.article-author h2{font-size:24px}.related .article-row{display:block;padding-block:25px}.related .article-row:first-child h3{font-size:28px}.related .row-category{margin-bottom:15px}.related .article-row .row-art{display:none}.related .article-row:first-child{border-top:1px solid var(--line)}
@media(max-width:1100px){.discovery{align-items:flex-start;flex-direction:column;gap:0;padding-bottom:15px}.filters{width:100%}.feature-copy{padding-right:28px}.feature .context-art{padding-left:32%;}.feature .context-stack{width:220px;height:290px}.feature .sheet{padding:24px}.feature .sheet strong{font-size:30px}.feature .sheet img{width:32px;height:32px}.article-heading h1{font-size:52px}body[data-page='article'] .article-heading{padding-left:240px}.reading-layout{grid-template-columns:190px minmax(0,1fr);gap:50px}.article-author{max-width:calc(100% - 288px)}}
@media(max-width:750px){.intro{padding-block:27px;grid-template-columns:100px 1fr;gap:20px}.intro h1{font-size:56px}.intro p{font-size:12px}.feature{display:flex;flex-direction:column;padding-bottom:48px;align-items:stretch}.feature .context-art{order:0;min-height:320px;padding:23px 24px 28px;overflow:hidden}.feature .context-stack{width:190px;height:225px;margin:20px 0}.feature .sheet{padding:18px}.feature .sheet strong{font-size:25px}.feature .sheet img{width:26px;height:26px;margin-bottom:16px}.feature .sheet span{font-size:11px}.feature .sheet-line{margin:12px 0 5px}.feature .art-top{font-size:12px}.feature .art-bottom{display:none}.feature-copy{order:1;margin:-22px 14px 0;background:var(--paper);padding:28px 24px;position:relative}.feature h2{font-size:36px;max-width:none}.feature-copy>p{font-size:14px}.feature .meta{font-size:12px;gap:12px}.feature .byline{font-size:12px}.feature .read-link{font-size:13px}.section-head h2{font-size:32px}.discovery{margin-top:22px}.filters{gap:6px 20px;flex-wrap:wrap}.filters button{padding-block:13px;font-size:12px}.format-filter{margin-top:8px;width:100%;justify-content:space-between}.format-filter select{font-size:12px}#article-list{grid-template-columns:1fr;gap:0}.article-row,.article-row:first-child{display:grid;grid-template-columns:1fr 90px;grid-row:auto;border-bottom:1px solid var(--line);gap:13px 18px;padding-block:25px}.article-row:first-child .row-art{order:initial;min-height:90px;margin:0}.article-row .row-art{min-height:90px}.article-row:first-child .row-art svg{width:55px;height:55px}.article-row:first-child .row-art img{width:45px;height:45px}.article-row h3,.article-row:first-child h3{font-size:26px}.article-row p{font-size:13px}.row-category{flex-wrap:wrap;gap:6px 14px}.author-grid>a{grid-template-rows:auto;grid-template-columns:80px 1fr}.author-grid .initial{grid-row:1/4}.author-grid h3{margin-top:0}.article-heading h1{font-size:43px;max-width:20ch}body[data-page='article'] .article-heading{padding:32px 0 30px;width:calc(100% - 48px)}.article-heading .deck{font-size:17px;line-height:1.7}.article-tools{margin-top:18px;gap:8px}.article-meta{margin-top:20px;min-height:130px}.article-meta .byline{min-height:130px;padding:20px 0;gap:12px}.article-meta .byline .avatar-image{width:100px;height:100px;margin:0}.article-meta .byline .initial:not(img){width:80px;height:80px}.article-meta #author-name{font-size:22px}.author-role{font-size:12px;line-height:1.6}.article-meta .byline>div{min-width:0}.reading-layout{width:calc(100% - 48px);display:flex;gap:28px;padding:0 0 35px}.reading-layout aside{position:static;border:1px solid #dce1e7;padding:18px 20px}.rail-title,.rail-description{display:none}.reading-layout summary{border:0;padding:0;margin:0}.reading-layout details[open] summary{margin-bottom:18px}.reading-layout aside nav{padding:0;gap:15px}.prose{font-size:18px;line-height:1.85}.prose h2{font-size:29px;line-height:1.25;margin-top:40px}.prose blockquote{font-size:29px;padding-block:25px}.article-author{max-width:none;width:calc(100% - 48px);margin:0 24px 42px}.article-author h2{font-size:22px}.related .article-row:first-child h3{font-size:26px}.related .article-row{display:block}.closing h2{font-size:38px}}
@media(max-width:370px){.feature-copy{margin-inline:6px;padding-inline:18px}.feature h2{font-size:32px}.intro{grid-template-columns:80px 1fr}.intro h1{font-size:48px}.intro p{font-size:12px}.article-heading h1{font-size:38px}.article-meta .byline .avatar-image{width:82px;height:82px}.article-meta #author-name{font-size:20px}.article-row,.article-row:first-child{grid-template-columns:1fr}.article-row .row-art,.article-row:first-child .row-art{display:none}}
/* IDEO reference: author illustration and editorial pauses. */
@media(min-width:751px){.feature-copy{padding-left:32px}.article-meta .byline .avatar-image{width:156px;height:156px;margin:-8px 0}.article-meta .byline{min-height:180px}}
.prose blockquote{color:var(--link)}

/* Article-specific editorial collage, shared between listing and article. */
.feature .context-art{padding:0;display:block;align-self:stretch;position:relative;overflow:hidden;min-height:580px}.feature-illustration{display:block;width:100%;height:100%;object-fit:cover;object-position:58% center;position:absolute;inset:0}.article-row .row-art,.article-row:first-child .row-art{padding:0;overflow:hidden}.article-row .row-art .editorial-thumb,.article-row:first-child .row-art .editorial-thumb{width:100%;height:100%;min-height:108px;object-fit:cover}.article-row:first-child .row-art .editorial-thumb{height:230px}.article-cover{margin:34px 0 0}.article-cover>img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block}.article-cover figcaption{font-size:11px;color:var(--muted);margin-top:10px}.related #related-list .row-art{display:block;min-height:0;margin-top:24px}.related #related-list .row-art img{height:200px;width:100%;object-fit:cover}
@media(max-width:750px){.feature .context-art{min-height:300px;aspect-ratio:3/2}.feature-illustration{object-position:center}.article-row .row-art .editorial-thumb,.article-row:first-child .row-art .editorial-thumb{height:100px;min-height:100px}.article-cover{margin-top:28px}.related #related-list .row-art img{height:auto;aspect-ratio:3/2}}
@media(max-width:370px){.article-row .row-art,.article-row:first-child .row-art{display:block;grid-column:1/-1}.article-row .row-art .editorial-thumb,.article-row:first-child .row-art .editorial-thumb{height:auto;aspect-ratio:3/2}}

/* Larger editorial images in the secondary column. */
@media(min-width:751px){
 #article-list>.article-row:not(:first-child){grid-template-columns:minmax(0,1fr) minmax(160px,42%);gap:16px 22px;align-items:start}
 #article-list>.article-row:not(:first-child) .row-art{align-self:start;aspect-ratio:4/3;min-height:0;width:100%}
 #article-list>.article-row:not(:first-child) .row-art .editorial-thumb{width:100%;height:100%;min-height:0;object-fit:cover}
 #article-list>.article-row:not(:first-child) h3{font-size:26px}
}
@media(min-width:751px) and (max-width:1100px){
 #article-list>.article-row:not(:first-child){grid-template-columns:1fr}
 #article-list>.article-row:not(:first-child) .row-art{grid-row:1;aspect-ratio:2/1}
}
@media(max-width:750px){
 #article-list>.article-row:not(:first-child){grid-template-columns:1fr}
 #article-list>.article-row:not(:first-child) .row-art{display:block;grid-row:1;grid-column:1/-1;aspect-ratio:2/1;min-height:0}
 #article-list>.article-row:not(:first-child) .row-art .editorial-thumb{width:100%;height:100%;min-height:0;object-fit:cover}
}

/* Image-safe feature: independent columns, intrinsic image, no cropping. */
.feature{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center;padding-top:16px}
.feature-copy{grid-column:auto;grid-row:auto;margin:0;padding:0;background:transparent;z-index:auto}
.feature .context-art{grid-column:auto;grid-row:auto;position:static;min-height:0;aspect-ratio:auto;align-self:center;background:transparent;overflow:visible;padding:0}
.feature .feature-illustration{position:static;display:block;width:100%;height:auto;object-fit:contain;object-position:center;max-width:100%}
@media(max-width:900px){.feature{gap:30px}.feature h2{font-size:38px}}
@media(max-width:750px){.feature{display:flex;flex-direction:column;gap:26px;padding-top:0;align-items:stretch}.feature .context-art{order:0;min-height:0;aspect-ratio:auto}.feature-copy{order:1;margin:0;padding:0}.feature h2{font-size:36px}}
@media(max-width:370px){.feature h2{font-size:32px}}

/* Equal editorial slides and a larger, connected feature image. */
.feature{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:24px}
.feature h2{font-size:clamp(36px,3.4vw,50px)}
.feature-copy>p{max-width:38ch}
#article-list{display:flex;gap:32px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--blue) #edf0f3;padding:12px 0 24px}
#article-list>.article-row,#article-list>.article-row:not(:first-child){display:flex;flex-direction:column;flex:0 0 calc((100% - 64px)/2.2);min-width:0;gap:18px;padding:0;border:0;scroll-snap-align:start}
#article-list>.article-row .row-art,#article-list>.article-row:not(:first-child) .row-art{display:block;order:-1;aspect-ratio:3/2;width:100%;min-height:0;margin:0;flex:none;background:#f7f6f2}
#article-list>.article-row .row-art .editorial-thumb,#article-list>.article-row:not(:first-child) .row-art .editorial-thumb{display:block;width:100%;height:100%;min-height:0;object-fit:contain}
#article-list>.article-row h3,#article-list>.article-row:not(:first-child) h3{font-size:30px;max-width:none}
#article-list>.article-row .row-category{gap:12px;flex-wrap:wrap}
.carousel-controls{display:flex;gap:8px;margin-left:auto}
.carousel-controls button{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:white;color:var(--ink);cursor:pointer}
.carousel-controls button:hover{border-color:var(--blue);color:var(--blue)}
.carousel-controls button:disabled{opacity:.3;cursor:default}
.carousel-controls svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6}
.results-line{display:flex;align-items:center;gap:16px}
@media(max-width:750px){.feature{gap:24px}.feature h2{font-size:36px}#article-list{gap:20px}#article-list>.article-row,#article-list>.article-row:not(:first-child){flex-basis:88%;gap:16px}#article-list>.article-row h3,#article-list>.article-row:not(:first-child) h3{font-size:27px}}

/* Author handwriting: keep the supplied font and arrow geometry intact. */
.annotated-passage{position:relative}
.prose .hn-annotation{position:static;inset:auto;width:auto;max-width:100%;border:0;padding:0;margin:8px 0 32px;align-self:auto;--hn-ink:#282a25;--hn-size:21px}
.prose .hn-note{font-family:'fudji sans',cursive;font-size:var(--hn-size,40px);line-height:1.15;font-weight:400;letter-spacing:0;margin:0}
body.has-handwritten-notes .reading-layout>aside{position:static;align-self:start}
@media(min-width:1101px){.prose .hn-annotation{position:absolute;left:auto;right:calc(100% + 48px);top:8px;width:max-content;max-width:220px;margin:0}}

/* Align the article index with the cover above, retaining the reading column. */
@media(min-width:751px){
 .reading-layout{position:relative}
 .reading-layout>aside,body.has-handwritten-notes .reading-layout>aside{position:absolute;top:var(--article-rail-top,0px);left:0;width:220px;padding:0}
 .reading-layout>.prose{grid-column:2}
}
@media(min-width:751px) and (max-width:1100px){.reading-layout>aside,body.has-handwritten-notes .reading-layout>aside{width:190px}}

/* One-time handwriting reveal near the viewport. */
.hn-word{display:inline-block}
@media(prefers-reduced-motion:no-preference){
 .hn-pending .hn-word{clip-path:inset(0 100% 0 0)}
 .hn-writing .hn-word{animation:hn-write .42s linear both;animation-delay:calc(var(--hn-order)*.16s)}
}
@keyframes hn-write{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@media print{.hn-pending .hn-word,.hn-writing .hn-word{clip-path:none;animation:none}}

/* Thin measured brackets: constant ink width at every paragraph height. */
.prose .hn-bracket{position:absolute;left:-28px;top:0;width:18px;max-width:none;overflow:visible;fill:none;stroke:#282a25;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.hn-bracket path{vector-effect:non-scaling-stroke}
.hn-letter{display:inline-block}
@media(max-width:750px){.prose .hn-bracket{left:-17px;width:11px}}
@media(prefers-reduced-motion:no-preference){
 .hn-pending .hn-word{clip-path:none}
 .hn-writing .hn-word{animation:none}
 .hn-pending .hn-letter{clip-path:inset(0 100% 0 0)}
 .hn-writing .hn-letter{animation:hn-write var(--hn-duration,.22s) cubic-bezier(.25,.1,.45,1) both;animation-delay:var(--hn-delay,0s)}
}
@media print{.hn-pending .hn-letter,.hn-writing .hn-letter{clip-path:none;animation:none}}

/* Draw the bracket before handwriting begins; retain both afterward. */
@media(prefers-reduced-motion:no-preference){
 .hn-bracket-pending .hn-bracket path{stroke-dasharray:1;stroke-dashoffset:1}
 .hn-bracket-writing .hn-bracket path{stroke-dasharray:1;animation:hn-bracket-draw 1s cubic-bezier(.35,.1,.45,1) both}
}
@keyframes hn-bracket-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@media print{.hn-bracket-pending .hn-bracket path,.hn-bracket-writing .hn-bracket path{stroke-dasharray:none;stroke-dashoffset:0;animation:none}}

.article-video{margin:30px 0}.article-video video{width:100%;height:auto;display:block;background:#141313}.article-video figcaption{font-size:12px;line-height:1.5;color:var(--muted);margin-top:10px}.article-table{margin:24px 0}.article-table table{border-collapse:collapse;width:100%;font-size:14px;line-height:1.6;table-layout:fixed}.article-table th,.article-table td{border:1px solid #d5ddd7;padding:12px;text-align:left;vertical-align:top;overflow-wrap:anywhere}.article-table th{font-weight:600;background:#f6f7f3}@media(max-width:600px){.article-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.article-table table,.article-table tbody,.article-table tr,.article-table td{display:block;width:auto}.article-table tr{border:1px solid #d5ddd7;margin-bottom:16px;padding:10px}.article-table td{border:0;padding:7px 4px}.article-table td:before{content:attr(data-label);display:block;font-size:11px;color:#52605a;font-weight:600}.article-table td:first-child{font-weight:600}}

/* Space between the cover and editorial title. */
.article-heading .article-cover + h1{margin-top:48px}
@media(max-width:750px){.article-heading .article-cover + h1{margin-top:32px}}

/* Compact article byline avatar. */
.article-meta .byline .avatar-image{width:64px;height:64px;margin:0}
@media(max-width:750px){.article-meta .byline .avatar-image{width:48px;height:48px}}

.article-meta .byline .avatar-image{width:48px;height:48px;margin:0}.carousel-controls{display:none}.author-grid{grid-template-columns:1fr}.author-grid>a{max-width:440px}
@media(max-width:750px){.article-meta .byline .avatar-image{width:40px;height:40px}}