.article-opening{padding:32px var(--p) 0;background:radial-gradient(ellipse at 80% 45%,#5401ff20,transparent 50%)}
.article-back{display:inline-block;font-size:11px;color:#c8ddf1;border-bottom:1px solid #9d89fc70;padding-bottom:7px}.article-back:hover{color:white}
.article-hero-grid{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:4vw;padding:48px 0 54px}.article-kicker{font-size:8px;letter-spacing:1.6px;color:#9d89fc;text-transform:uppercase}.article-experience h1{font:400 clamp(43px,4.6vw,72px)/1.1 Anton;max-width:100%;margin:24px 0;overflow-wrap:break-word}.article-deck{font-size:16px;line-height:1.8;color:#c8ddf1;max-width:510px}.article-byline{display:flex;align-items:center;gap:13px;margin-top:30px}.article-byline img,.article-author img{border-radius:50%;object-fit:cover;background:#9d89fc20}.article-byline div{display:grid;gap:6px;font-size:10px}.article-byline strong{font-weight:500}.article-byline span{color:#93abc1;font-size:9px}.article-art{position:relative;min-width:0;aspect-ratio:1/1;display:grid;place-items:center}.article-art svg{width:100%;height:100%}.article-art>span{position:absolute;bottom:22px;left:20px;font-size:6px;letter-spacing:1.6px;color:#9d89fc}.article-art .blog-art-core{animation:article-float 8s ease-in-out infinite}.article-art .blog-art-satellites{animation:article-float 10s ease-in-out -3s infinite}.article-reading-cue{border-top:1px solid #9d89fc30;display:flex;align-items:center;justify-content:space-between;padding:23px 0;font-size:8px;letter-spacing:1px;color:#93abc1}.article-reading-cue a{font-size:11px;color:white;letter-spacing:0;display:flex;align-items:center;gap:18px}.article-reading-cue b{display:grid;place-items:center;width:30px;height:30px;border:1px solid #9d89fc70;border-radius:50%;font-size:17px;font-weight:400}
.article-experience .page-content{background:#f6f7fb;color:#051a2f;padding-top:70px}.article-layout{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,720px);gap:7vw;max-width:1160px;margin:auto;scroll-margin-top:40px}.article-aside{position:relative}.article-aside nav{display:block;position:sticky;top:120px;max-width:240px}.article-aside nav>span{font-size:8px;letter-spacing:1.5px;color:#7253bb;display:block;margin-bottom:22px}.article-aside a{display:flex;gap:13px;padding:12px 0;border-top:1px solid #051a2f18;font-size:11px;line-height:1.6;color:#5b6e82;transition:color .2s}.article-aside a small{font-size:8px;color:#8b74c5;padding-top:2px}.article-aside a:hover,.article-aside a[aria-current]{color:#5401ff}.article-experience .reading{max-width:720px;min-width:0}.article-experience .reading h2{color:#051a2f;font-size:clamp(26px,2.6vw,35px);line-height:1.25;margin:60px 0 23px;scroll-margin-top:110px}.article-experience .reading h2:first-child{margin-top:0}.article-experience .reading p,.article-experience .reading li{color:#3b5065;font-size:16px;line-height:1.95}.article-experience .reading h3{color:#7253bb}.article-experience .reading a{color:#5401ff;text-decoration:underline;text-underline-offset:4px}.article-experience .reading blockquote{background:#9d89fc12;color:#513684;border-left:2px solid #9d89fc}.article-author{display:flex;gap:17px;align-items:center;border-top:1px solid #051a2f25;padding:30px 0;margin-top:55px}.article-author div{display:grid;gap:7px}.article-author small{font-size:7px;letter-spacing:1.4px;color:#7253bb}.article-author strong{font-size:15px;font-weight:500}.article-author span{font-size:10px;color:#5b6e82}.article-experience .related-title{font:400 clamp(32px,4vw,50px) Anton;margin-top:70px;border-top:1px solid #051a2f25;padding-top:45px}.article-experience .page-cards{grid-template-columns:1fr 1fr;gap:35px}.article-experience .page-card{background:transparent;border:0;border-radius:0;padding:0;min-width:0}.article-experience .page-card:hover{transform:none;background:transparent}.article-related-art{height:230px;overflow:hidden;background:#051a2f;border-radius:8px;margin-bottom:24px}.article-related-art svg{height:100%;width:100%;transition:transform .7s}.article-experience .page-card:hover svg{transform:scale(1.04)}.article-experience .page-card>span{font-size:8px;color:#7253bb}.article-experience .page-card h2{font-size:30px;max-width:450px;margin:18px 0 13px}.article-experience .page-card p{color:#3b5065}.article-experience .page-card b{color:#5401ff;border-top:1px solid #051a2f20;margin-top:22px;padding-top:18px}.article-experience .page-cta{margin-top:40px}.article-experience .page-cta a{color:#5401ff}.article-experience .page-cta a:first-child{background:#051a2f;color:white;border-color:#051a2f}.article-progress{position:fixed;inset:0 0 auto;height:2px;z-index:100;pointer-events:none}.article-progress i{display:block;height:100%;background:#9d89fc;transform:scaleX(var(--read-progress,0));transform-origin:left}
@keyframes article-float{50%{transform:translateY(-9px)}}
@media(max-width:900px){.article-hero-grid{gap:20px}.article-experience h1{font-size:5.5vw}.article-deck{font-size:14px}.article-layout{gap:35px;grid-template-columns:180px minmax(0,1fr)}.article-aside a{font-size:10px}}
@media(max-width:700px){.article-opening{padding-top:22px}.article-hero-grid{grid-template-columns:1fr;padding:30px 0 20px;gap:12px}.article-experience h1{font-size:clamp(37px,10.4vw,58px);margin:19px 0}.article-kicker{font-size:7px;letter-spacing:1px}.article-deck{font-size:13px;line-height:1.8}.article-byline{margin-top:23px}.article-art{height:230px;aspect-ratio:auto}.article-art svg{max-width:330px}.article-art>span{font-size:5px;bottom:6px;left:0}.article-reading-cue>span{font-size:6px;letter-spacing:.6px}.article-reading-cue{gap:12px;padding:18px 0}.article-reading-cue a{font-size:10px;gap:10px;white-space:nowrap}.article-experience .page-content{padding-top:35px;padding-bottom:100px}.article-layout{display:block}.article-aside{margin-bottom:35px}.article-aside nav{position:static;max-width:100%;display:flex;gap:16px;overflow-x:auto;padding-bottom:12px;overscroll-behavior-x:contain}.article-aside nav>span{display:none}.article-aside a{flex:0 0 175px;font-size:10px;padding-top:12px}.article-experience .reading p,.article-experience .reading li{font-size:15px;line-height:1.9}.article-experience .reading h2{font-size:28px;margin-top:43px;scroll-margin-top:35px}.article-author span{font-size:9px}.article-author img{width:48px;height:48px}.article-experience .page-cards{grid-template-columns:1fr;gap:35px}.article-related-art{height:200px;margin-bottom:19px}.article-experience .page-card h2{font-size:28px}.article-experience .related-title{margin-top:40px;padding-top:35px}.article-experience .page-cta{gap:12px}.article-experience .page-cta a{font-size:11px;padding:14px 20px}}
@media(prefers-reduced-motion:reduce){.article-art .blog-art-core,.article-art .blog-art-satellites{animation:none}.article-related-art svg{transition:none}}
/* Two full-screen destinations immediately after the final paragraph. */
.article-experience .page-content{padding-bottom:45px}
.read-on{padding:0!important;background:#051a2f;position:relative;min-height:100dvh;display:flex;flex-direction:column;isolation:isolate;color:white}
.read-on-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:28px var(--p);border-bottom:1px solid #9d89fc25;background:#071c32}
.read-on-heading h2{font:400 clamp(24px,2.7vw,39px)/1.2 Anton;margin:0}.read-on-heading>a{font-size:10px;color:#c8ddf1;border-bottom:1px solid #9d89fc80;padding-bottom:6px;white-space:nowrap}
.read-on-choices{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;flex:1;gap:0}
.read-on-choice{position:relative;display:flex;align-items:end;overflow:hidden;min-width:0;padding:clamp(28px,4vw,65px);background:radial-gradient(ellipse at 70% 20%,#5401ff22,transparent 65%);isolation:isolate}
.read-on-choice+.read-on-choice{border-left:1px solid #9d89fc40;background:radial-gradient(ellipse at 30% 20%,#9d89fc20,transparent 65%)}
.read-on-visual{position:absolute;inset:0 0 32%;display:grid;place-items:center;z-index:-1;pointer-events:none;transition:translate .7s cubic-bezier(.2,.7,.2,1),opacity .6s;opacity:.8}
.read-on-visual svg{width:100%;height:100%;max-height:430px}.read-on-copy{width:100%;position:relative}.read-on-direction{font-size:9px;text-transform:uppercase;letter-spacing:1.6px;color:#9d89fc;display:flex;align-items:center;gap:12px}.read-on-direction:before{content:'';width:22px;height:1px;background:#9d89fc}
.read-on-copy h3{font:400 clamp(30px,3.3vw,53px)/1.14 Anton;max-width:520px;margin:22px 0 28px;text-wrap:balance}.read-on-action{font-size:11px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #9d89fc40;padding-top:18px;color:#c8ddf1}.read-on-action b{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid #9d89fc70;font-size:21px;font-weight:300;transition:background .3s,rotate .5s}
.read-on-choice:hover .read-on-visual,.read-on-choice:focus-visible .read-on-visual{translate:0 -10px;opacity:1}.read-on-choice:hover .read-on-action b,.read-on-choice:focus-visible .read-on-action b{background:#9d89fc30;rotate:90deg}.read-on-choice:focus-visible{outline:2px solid #c8ddf1;outline-offset:-4px}
@media(min-width:701px) and (max-height:700px){.read-on-visual{inset:0 0 35%;opacity:.65}.read-on-copy h3{font-size:clamp(28px,3vw,44px);margin:16px 0 20px}.read-on-choice{padding-top:200px}}
@media(max-width:700px){.article-experience .page-content{padding-bottom:25px}.read-on{min-height:100dvh;padding-bottom:calc(88px + env(safe-area-inset-bottom))!important}.read-on-heading{padding:22px var(--p);gap:15px}.read-on-heading h2{font-size:24px;max-width:220px}.read-on-heading>a{font-size:9px}.read-on-choices{grid-template-columns:1fr;grid-template-rows:1fr 1fr}.read-on-choice{padding:24px var(--p);min-height:260px;align-items:center}.read-on-choice+.read-on-choice{border-left:0;border-top:1px solid #9d89fc40}.read-on-visual{inset:0 -30px 0 40%;opacity:.5}.read-on-visual svg{max-height:250px}.read-on-copy{max-width:100%}.read-on-direction{font-size:7px;letter-spacing:1px}.read-on-copy h3{font-size:clamp(25px,7.2vw,34px);max-width:75%;margin:15px 0 18px;text-wrap:initial}.read-on-action{font-size:10px;padding-top:12px}.read-on-action b{width:28px;height:28px;font-size:18px}}
@media(max-width:700px) and (max-height:740px){.read-on-choice{min-height:220px;padding-top:18px;padding-bottom:18px}.read-on-copy h3{font-size:25px;margin:12px 0}.read-on-heading{padding-top:18px;padding-bottom:18px}.read-on-heading h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){.read-on-visual,.read-on-action b{transition:none}.read-on-choice:hover .read-on-visual{translate:none}}
@media(max-width:700px) and (max-height:740px){.read-on{height:100dvh;min-height:0}.read-on-choices{min-height:0}.read-on-choice{min-height:0;padding-top:12px;padding-bottom:12px}.read-on-copy h3{font-size:21px;line-height:1.12;margin:10px 0;max-width:80%}.read-on-action{padding-top:8px}.read-on-action b{width:24px;height:24px}.read-on-heading h2{font-size:20px}.read-on-heading{padding-top:14px;padding-bottom:14px}}
/* Keep chapter navigation available for the complete reading section. */
.article-aside nav{max-height:calc(100dvh - 145px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#9d89fc70 transparent}
.article-aside a[aria-current]{font-weight:600;border-top-color:#9d89fc;background:#9d89fc0c}
@media(max-width:700px){
 .article-aside{position:sticky;top:0;z-index:35;margin:0 calc(-1 * var(--p)) 28px;padding:12px var(--p) 0;background:#f6f7fb;border-bottom:1px solid #051a2f20;box-shadow:0 8px 15px #051a2f08}
 .article-aside nav{position:static;max-height:none;overflow-y:hidden;overflow-x:auto;gap:12px;padding-bottom:10px;scrollbar-width:none;scroll-padding-inline:4px}
 .article-aside nav::-webkit-scrollbar{display:none}
 .article-aside a{flex:0 0 170px;min-height:57px;padding:9px 8px 8px;align-items:flex-start;border-top:2px solid #051a2f18}
 .article-aside a small{flex:none}.article-aside a span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 .article-experience .reading h2{scroll-margin-top:22px}
}
/* Mobile chapter navigation: a single quiet active-text cue. */
@media(max-width:700px){
 .article-progress{display:block}
 .article-aside a,.article-aside a[aria-current]{border-top:0;background:transparent}
 .article-aside a[aria-current]{color:#5401ff;font-weight:600}
}
