@font-face{font-family:Study;src:url(/static/fonts/study-sans.963ad3d07793.woff2);font-weight:100 900;font-display:swap}
@font-face{font-family:Manrope;src:url(/static/fonts/manrope.c90888612fe7.woff2);font-weight:200 800;font-display:swap}
:root{--paper:#fffdf8;--ink:#1b1b19;--muted:#736e66;--line:#ded9d0;--red:#c43a2b;--wash:#f4f1eb;--rose:#f6e9e2;--lilac:#e5def5;--card:#fffefb;--shadow:0 24px 65px #30261614;--max:1392px;--ease:cubic-bezier(.16,1,.3,1)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--paper:#1c1c1a;--ink:#f4f0e7;--muted:#b2aba0;--line:#44423d;--red:#ed7f6c;--wash:#272623;--rose:#3d2924;--lilac:#37313f;--card:#252522;--shadow:0 24px 65px #0003}}
:root[data-theme=dark]{--paper:#1c1c1a;--ink:#f4f0e7;--muted:#b2aba0;--line:#44423d;--red:#ed7f6c;--wash:#272623;--rose:#3d2924;--lilac:#37313f;--card:#252522;--shadow:0 24px 65px #0003}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 Study,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}img{display:block;max-width:100%;height:auto}::selection{background:var(--rose);color:var(--red)}a:focus-visible,button:focus-visible{outline:2px solid var(--red);outline-offset:6px}p,h1,h2,h3{margin:0}h1,h2,h3{line-height:1.2;letter-spacing:-.045em}h2{font-size:clamp(32px,3.3vw,52px);font-weight:650}p{color:var(--muted)}.wrap{max-width:var(--max);margin:auto;width:calc(100% - 112px)}
/* layers: content 0, staged artwork 1–3, navigation 10 */
.nav{height:86px;display:flex;align-items:center;justify-content:space-between;gap:32px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:14px;font-size:22px;font-weight:650;letter-spacing:.05em}.brand img{width:45px;height:31px;object-fit:contain}.dark-logo{display:none}.nav-links{display:flex;gap:32px;margin-left:auto;font-size:14px}.nav-actions{display:flex;align-items:center;gap:24px;font-size:14px}.theme{padding:0;border:0;background:none;color:var(--muted);font-size:13px}.enter{display:inline-flex;align-items:center;gap:13px;font-weight:650;border-bottom:1px solid var(--ink);padding:5px 0}.landing-icon{display:inline-block;width:18px;height:18px;flex:none;vertical-align:-.15em;fill:currentColor}.arrow{transition:transform .3s var(--ease)}.nav-links a:last-child{display:inline-flex;align-items:center;gap:8px}.art-caption .landing-icon{width:12px;height:12px;margin-inline:3px}a:hover .arrow{transform:translate(3px,-2px)}a:hover .arrow-down{transform:translateY(3px)}
.hero{min-height:790px;height:calc(100svh - 86px);max-height:1000px;position:relative;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:34px;padding-bottom:85px}.hero-copy{position:relative;z-index:3;padding-bottom:35px}.hero h1{font-size:clamp(42px,4.1vw,65px);font-weight:650;line-height:1.19;letter-spacing:-.055em;white-space:nowrap}.hero h1 em{color:var(--red);font-style:normal}.hero-copy>p{font-size:17px;line-height:1.8;max-width:425px;margin:26px 0 31px}.actions{display:flex;align-items:center;gap:26px}.primary{display:inline-flex;align-items:center;justify-content:center;gap:23px;background:var(--red);color:var(--paper);padding:13px 22px;border-radius:3px;font-weight:600;font-size:14px;transition:transform .3s var(--ease),filter .3s}.primary:hover{transform:translateY(-2px);filter:brightness(.94)}.text-link{display:inline-flex;align-items:center;gap:13px;font-size:14px}.hero-art{position:relative;height:600px;min-width:0;perspective:1400px}.hero-art:before{content:'';position:absolute;inset:70px 7px 65px 80px;border:1px solid var(--line);border-radius:50%;transform:rotate(-25deg)}.hero-art:after{content:'';position:absolute;left:20px;top:122px;width:62px;height:4px;background:var(--red);transform:rotate(-40deg)}.paper-layer{position:absolute;width:275px;left:40px;top:10px;transform:rotate(-9deg);border:1px solid var(--line);box-shadow:var(--shadow);background:#fff}.paper-layer img{width:100%}.slide-layer{position:absolute;z-index:2;width:540px;max-width:94%;right:-3px;top:225px;transform:rotate(4deg);border:1px solid #d1cbc0;box-shadow:0 30px 70px #30261625;background:#fffdf8}.slide-layer img{width:100%}.note-layer{position:absolute;z-index:3;right:16px;top:40px;width:235px;background:var(--lilac);border-left:3px solid var(--ink);padding:21px 23px;transform:rotate(5deg);box-shadow:0 12px 40px #3026160d}.note-layer small{font-size:11px;letter-spacing:.06em}.note-layer p{font-size:15px;color:var(--ink);line-height:1.6;margin-top:12px}.note-layer .note-sign{margin-top:15px;font-size:11px;color:var(--muted)}.art-caption{position:absolute;bottom:14px;right:15px;font-size:11px;color:var(--muted);letter-spacing:.03em}.hero-bottom{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:23px 0;font-size:12px;color:var(--muted)}.flow-inline{display:flex;align-items:center;gap:22px}.flow-inline b{font-weight:500;color:var(--ink)}.flow-inline .landing-icon{width:14px;height:14px;color:var(--muted)}
.manifesto{padding:113px 0 105px;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end}.manifesto h2{font-size:40px;line-height:1.35;max-width:600px}.manifesto p{max-width:450px;font-size:16px;line-height:1.9}.section-label{font-family:Manrope,Study,sans-serif;font-size:12px;letter-spacing:.09em;color:var(--red);margin-bottom:25px}.manifesto .section-label{grid-column:1 / -1;margin:0 0 -30px}
.journey{height:270vh;min-height:2150px;position:relative;view-timeline-name:--journey;view-timeline-axis:block;background:var(--wash);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.journey-stage{height:100svh;min-height:700px;max-height:1080px;position:sticky;top:0;overflow:hidden}.journey-inner{height:100%;display:grid;grid-template-columns:330px minmax(0,1fr);align-items:center;gap:80px;position:relative}.journey-intro{position:absolute;top:52px;left:0;font-size:12px;letter-spacing:.06em;color:var(--muted)}.chapter-copy{grid-area:1 / 1;opacity:0;transform:translateY(30px)}.chapter-copy.first{opacity:1;transform:none}.chapter-num{font:500 16px Manrope;margin-bottom:28px;color:var(--red)}.chapter-copy h2{font-size:44px;line-height:1.28;margin-bottom:25px}.chapter-copy p{font-size:15px;line-height:1.9;max-width:300px}.chapter-tags{margin-top:30px;padding-top:20px;border-top:1px solid var(--line);font-size:12px;line-height:2;color:var(--muted)}.chapter-visual{grid-area:1 / 2;position:relative;width:100%;aspect-ratio:1.35;opacity:0;transform:translateY(70px) scale(.94)}.chapter-visual.first{opacity:1;transform:none}.reading-paper{position:absolute;width:55%;left:6%;top:2%;height:94%;object-fit:cover;object-position:top;border:1px solid #d9d3ca;box-shadow:var(--shadow);transform:rotate(-5deg)}.reading-note{position:absolute;right:0;top:28%;width:53%;background:var(--card);border:1px solid var(--line);border-top:3px solid var(--red);padding:32px;box-shadow:var(--shadow)}.reading-note small{font-size:11px;color:var(--red)}.reading-note h3{font-size:22px;margin:16px 0}.reading-note p{font-size:14px;line-height:1.8}.reading-note footer{font-size:11px;color:var(--muted);border-top:1px solid var(--line);margin-top:24px;padding-top:15px}.product-window{position:absolute;width:110%;max-width:none;left:0;top:12%;border:1px solid #ccc6bc;box-shadow:var(--shadow);border-radius:5px}.loose-slide{position:absolute;width:56%;right:-2%;bottom:-3%;border:1px solid #d4cec5;box-shadow:var(--shadow);transform:rotate(-4deg)}.editor-image{top:7%;width:113%}.steps-rail{position:absolute;left:0;bottom:43px;display:flex;gap:30px;font:500 12px Manrope,Study,sans-serif;color:var(--muted)}.steps-rail span{border-top:2px solid var(--line);padding-top:10px;width:93px}.steps-rail b{font-weight:500;color:var(--ink)}
@keyframes chapter-one{0%,22%{opacity:1;transform:translateY(0)}32%,100%{opacity:0;transform:translateY(-30px)}}
@keyframes chapter-two{0%,25%{opacity:0;transform:translateY(35px)}35%,58%{opacity:1;transform:translateY(0)}68%,100%{opacity:0;transform:translateY(-30px)}}
@keyframes chapter-three{0%,60%{opacity:0;transform:translateY(35px)}72%,100%{opacity:1;transform:translateY(0)}}
@keyframes art-one{0%,22%{opacity:1;transform:translateY(0) rotate(0)}33%,100%{opacity:0;transform:translateY(-95px) rotate(-3deg)}}
@keyframes art-two{0%,25%{opacity:0;transform:translateY(95px) scale(.93)}36%,58%{opacity:1;transform:translateY(0) scale(1)}69%,100%{opacity:0;transform:translateY(-95px) scale(.96)}}
@keyframes art-three{0%,60%{opacity:0;transform:translateY(95px) scale(.94)}73%,100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes paper-parallax{to{transform:translate(-35px,-105px) rotate(-15deg)}}
@keyframes slide-parallax{to{transform:translate(25px,-185px) rotate(-1deg)}}
@keyframes note-parallax{to{transform:translate(15px,-65px) rotate(9deg)}}
@keyframes hero-enter{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes reveal{from{opacity:0;transform:translateY(45px)}to{opacity:1;transform:translateY(0)}}
@supports(animation-timeline:view()){@media(min-width:901px) and (prefers-reduced-motion:no-preference){.chapter-copy,.chapter-visual{animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--journey;animation-range:contain 0% contain 100%}.chapter-copy.first{animation-name:chapter-one}.chapter-copy.second{animation-name:chapter-two}.chapter-copy.third{animation-name:chapter-three}.chapter-visual.first{animation-name:art-one}.chapter-visual.second{animation-name:art-two}.chapter-visual.third{animation-name:art-three}.paper-layer{animation:paper-parallax linear both;animation-timeline:scroll(root block);animation-range:0px 950px}.slide-layer{animation:slide-parallax linear both;animation-timeline:scroll(root block);animation-range:0px 950px}.note-layer{animation:note-parallax linear both;animation-timeline:scroll(root block);animation-range:0px 950px}.reveal{animation:reveal linear both;animation-timeline:view();animation-range:entry 5% entry 85%}}}
@media(prefers-reduced-motion:no-preference){.hero-copy{animation:hero-enter 1s var(--ease) both}.hero-art{animation:hero-enter 1.2s .12s var(--ease) both}}
.detail{padding:115px 0 105px}.detail-top{display:flex;justify-content:space-between;gap:80px;align-items:end;margin-bottom:54px}.detail-top h2{max-width:650px;line-height:1.3}.detail-top p{font-size:15px;max-width:325px;line-height:1.9}.detail-visual{display:grid;grid-template-columns:1.5fr 1fr;gap:20px;align-items:center}.figure-main{background:#eae5db;padding:27px;position:relative}.figure-main img{width:100%;box-shadow:0 12px 30px #30261613}.figure-caption{font-size:11px;margin-top:14px;color:#6c665e}.figure-side{padding:0 0 0 43px}.detail-item{padding:22px 0;border-bottom:1px solid var(--line)}.detail-item:first-child{padding-top:0}.detail-item h3{font-size:20px;letter-spacing:-.02em;margin-bottom:11px;font-weight:600}.detail-item p{font-size:14px;line-height:1.8}.detail-item span{color:var(--red);font:12px Manrope;margin-right:14px}.closing{padding:85px 0 75px;border-top:1px solid var(--line);position:relative}.closing .wrap{display:flex;justify-content:space-between;gap:50px;align-items:center}.closing h2{font-size:42px;margin-bottom:15px}.closing p{font-size:15px}.footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:28px 0 32px;color:var(--muted);font-size:11px}.footer .brand{font-size:16px;color:var(--ink)}.footer .brand img{width:30px;height:23px}.prototype-note{font-size:10px;color:var(--muted)}
@media(min-width:1700px){.hero h1{font-size:68px}.hero-art{height:650px}.slide-layer{width:590px}.paper-layer{width:302px}.note-layer{top:55px}.hero-copy>p{font-size:18px}}
@media(max-width:1200px){.wrap{width:calc(100% - 72px)}.hero{grid-template-columns:1fr 1fr;gap:10px;min-height:710px}.hero h1{font-size:48px}.hero-art{height:520px}.paper-layer{width:230px;left:14px;top:10px}.note-layer{width:190px;right:0;top:30px;padding:18px}.note-layer p{font-size:13px}.slide-layer{top:220px;width:440px}.hero-copy>p{font-size:15px;max-width:340px}.journey-inner{grid-template-columns:280px minmax(0,1fr);gap:55px}.chapter-copy h2{font-size:38px}.reading-note{padding:23px}.reading-note h3{font-size:19px}.detail-top h2{font-size:38px}.figure-side{padding-left:20px}}
@media(max-width:900px){.wrap{width:calc(100% - 48px)}.nav{height:72px}.nav-links{display:none}.nav-actions{gap:18px}.hero{display:flex;flex-direction:column;align-items:stretch;height:auto;max-height:none;min-height:0;padding:58px 0 84px;gap:36px}.hero-copy{padding:0}.hero h1{font-size:clamp(40px,7vw,60px)}.hero-copy>p{max-width:440px;margin:22px 0 25px}.hero-art{height:470px;width:580px;max-width:100%;margin:0 auto}.paper-layer{width:228px;left:25px}.slide-layer{width:490px;top:193px;right:0}.note-layer{width:200px;right:8px;top:8px}.art-caption{bottom:4px;font-size:10px}.hero-bottom{padding:20px 0}.hero-bottom>span{display:none}.flow-inline{width:100%;justify-content:space-between;gap:10px;font-size:11px}.manifesto{padding:70px 0;grid-template-columns:1fr;gap:25px}.manifesto .section-label{margin-bottom:0}.manifesto h2{font-size:32px}.manifesto p{font-size:14px;max-width:560px}.journey{height:auto;min-height:0}.journey-stage{position:static;height:auto;max-height:none;min-height:0;overflow:hidden}.journey-inner{display:grid;grid-template-columns:1fr;gap:0;padding:50px 0 30px}.journey-intro{position:static;margin-bottom:30px}.chapter-copy,.chapter-copy.first{grid-area:auto;opacity:1;transform:none;animation:none}.chapter-copy h2{font-size:32px;line-height:1.3;margin-bottom:15px}.chapter-copy h2 br{display:none}.chapter-num{margin-bottom:14px}.chapter-copy p{max-width:550px;font-size:14px}.chapter-tags,.steps-rail{display:none}.chapter-visual,.chapter-visual.first{grid-area:auto;opacity:1;transform:none;animation:none;aspect-ratio:1.45;margin:32px 0 60px}.chapter-copy.second{grid-row:4}.chapter-visual.second{grid-row:5}.chapter-copy.third{grid-row:6}.chapter-visual.third{grid-row:7}.product-window,.editor-image{width:100%;left:0;top:0}.reading-paper{width:48%;left:8%}.reading-note{width:53%;padding:22px;top:22%}.reading-note h3{font-size:19px;margin:12px 0}.reading-note p{font-size:13px}.reading-note footer{margin-top:14px}.loose-slide{width:50%;right:1%;bottom:0}.detail{padding:70px 0}.detail-top{display:block;margin-bottom:30px}.detail-top h2{font-size:32px}.detail-top p{margin-top:20px;max-width:500px;font-size:14px}.detail-visual{grid-template-columns:1fr}.figure-main{padding:15px}.figure-side{padding:12px 0 0}.detail-item{padding:20px 0}.detail-item h3{font-size:19px}.closing{padding:55px 0}.closing .wrap{display:block}.closing h2{font-size:32px;line-height:1.3}.closing .primary{margin-top:27px}.footer{align-items:start;gap:15px;flex-wrap:wrap}.prototype-note{max-width:230px;text-align:right}}
@media(max-width:450px){.nav-actions .theme{display:none}.nav-actions{gap:0}.brand{font-size:19px;gap:10px}.brand img{width:37px}.hero{padding-top:44px}.hero h1{font-size:39px}.hero-copy>p{font-size:14px;max-width:310px}.hero-art{height:355px;margin-top:4px;overflow:clip}.paper-layer{width:172px;left:8px;top:5px}.note-layer{width:151px;padding:13px;right:0;top:15px}.note-layer small{font-size:9px}.note-layer p{font-size:11px;margin-top:8px}.note-sign{display:none}.slide-layer{width:320px;top:163px;right:0}.hero-art:before{inset:30px 0 20px 20px}.hero-art:after{left:1px;top:110px;width:35px}.art-caption{right:0;font-size:9px}.actions{gap:20px}.primary{padding:12px 17px;font-size:13px;gap:16px}.text-link{font-size:13px}.manifesto h2{font-size:29px}.chapter-copy h2{font-size:29px}.chapter-visual.first{aspect-ratio:1.05}.reading-paper{width:55%;left:0;height:92%}.reading-note{width:62%;top:26%;padding:16px}.reading-note h3{font-size:17px}.reading-note p{font-size:12px}.reading-note footer{font-size:9px}.figure-caption{font-size:10px}.closing h2{font-size:29px}.footer .brand{font-size:14px}.prototype-note{max-width:165px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}.journey{height:auto;min-height:0}.journey-stage{position:static;height:auto;max-height:none;overflow:hidden}.journey-inner{display:flex;flex-wrap:wrap;gap:35px;padding:65px 0}.journey-intro,.steps-rail{display:none}.chapter-copy,.chapter-copy.first{width:30%;opacity:1;transform:none}.chapter-visual,.chapter-visual.first{width:62%;opacity:1;transform:none}.chapter-copy.second{order:2}.chapter-visual.second{order:3}.chapter-copy.third{order:4}.chapter-visual.third{order:5}}
@media(max-width:900px) and (prefers-reduced-motion:reduce){.journey-inner{display:grid}.chapter-copy,.chapter-visual,.chapter-copy.first,.chapter-visual.first{width:100%;order:initial}}
@supports not(animation-timeline:view()){.journey{height:auto;min-height:0}.journey-stage{height:auto;max-height:none;position:static}.journey-inner{display:flex;flex-wrap:wrap;gap:40px;padding:70px 0}.journey-intro,.steps-rail{display:none}.chapter-copy,.chapter-copy.first{width:30%;opacity:1;transform:none}.chapter-visual,.chapter-visual.first{width:62%;opacity:1;transform:none}.chapter-copy.second{order:2}.chapter-visual.second{order:3}.chapter-copy.third{order:4}.chapter-visual.third{order:5}}

/* Richer editorial composition: material layers, chapter scale, and an interactive specimen. */
.hero-art{isolation:isolate}.hero-art:before{inset:32px -8px 20px 26px;border-radius:0;border:0;background-image:radial-gradient(var(--line) .8px,transparent .8px);background-size:16px 16px;transform:none;mask-image:linear-gradient(120deg,transparent 4%,#000 35%,#000 75%,transparent)}.hero-art:after{display:none}
.material-plane{position:absolute;z-index:-1;inset:135px 17px 50px 85px;background:var(--lilac);transform:rotate(-13deg);border-radius:2px;opacity:.65}.material-stroke{position:absolute;z-index:-1;left:5%;top:44%;width:90%;height:65px;background:var(--red);transform:rotate(-36deg);opacity:.92;clip-path:polygon(8% 0,100% 0,92% 100%,0 100%)}
.hero h1 em{position:relative}.hero h1 em:after{content:'';position:absolute;left:0;right:2px;bottom:-7px;height:6px;background:var(--red);opacity:.16;transform:rotate(-1.8deg);transform-origin:left}
.hero-copy>p{margin-top:32px}.paper-layer{box-shadow:0 18px 48px #3026161c}.slide-layer{box-shadow:0 34px 70px #3026162c}.note-layer{right:0;top:17px;transform:rotate(7deg);background:var(--card);border:1px solid var(--line);border-top:3px solid var(--red);padding:20px 22px}.note-layer small{color:var(--red)}
.manifesto{position:relative;border-top:0;padding-bottom:122px}.manifesto:after{content:'';position:absolute;left:0;bottom:0;width:100%;height:5px;background:linear-gradient(to right,var(--red) 0 26%,var(--lilac) 26% 67%,var(--line) 67%)}
.journey{background:var(--wash)}.chapter-copy{position:relative;z-index:2}.chapter-num{display:flex;align-items:center;gap:18px}.chapter-num:before{content:'';width:36px;height:2px;background:var(--red)}.chapter-visual:before{position:absolute;z-index:-1;right:6%;top:-100px;font:800 210px/.8 Manrope;color:var(--line);opacity:.5;letter-spacing:-.1em;pointer-events:none}.chapter-visual.first:before{content:'01'}.chapter-visual.second:before{content:'02'}.chapter-visual.third:before{content:'03'}.chapter-visual:after{content:'';position:absolute;z-index:-1;width:80%;height:77%;left:4%;top:15%;border:1px solid var(--line);transform:rotate(-5deg)}.chapter-visual.second:after{background:var(--lilac);border:0;opacity:.5;transform:rotate(3deg)}.chapter-visual.third:after{border:1px solid var(--red);transform:rotate(-3deg)}
.steps-rail span{position:relative}.steps-rail span:before{content:'';position:absolute;top:-2px;left:0;right:0;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left}
@keyframes rail-one{0%,25%{transform:scaleX(1)}35%,100%{transform:scaleX(0)}}@keyframes rail-two{0%,25%{transform:scaleX(0)}35%,60%{transform:scaleX(1)}70%,100%{transform:scaleX(0)}}@keyframes rail-three{0%,60%{transform:scaleX(0)}75%,100%{transform:scaleX(1)}}
@keyframes plane-parallax{to{transform:translateY(-85px) rotate(-4deg)}}@keyframes stroke-parallax{to{transform:translate(0,-130px) rotate(-24deg)}}
@supports(animation-timeline:view()){@media(min-width:901px) and (prefers-reduced-motion:no-preference){.material-plane{animation:plane-parallax linear both;animation-timeline:scroll(root block);animation-range:0px 950px}.material-stroke{animation:stroke-parallax linear both;animation-timeline:scroll(root block);animation-range:0px 950px}.steps-rail span:before{animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--journey;animation-range:contain 0% contain 100%}.steps-rail span:nth-child(1):before{animation-name:rail-one}.steps-rail span:nth-child(2):before{animation-name:rail-two}.steps-rail span:nth-child(3):before{animation-name:rail-three}}}
.detail-visual{grid-template-columns:1.6fr 1fr;gap:55px}.specimen{position:relative;padding-top:40px}.specimen:before{content:'';position:absolute;inset:20px 16px 60px 16px;background:var(--lilac);transform:rotate(-4deg);opacity:.7}.figure-main{position:relative;padding:18px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);transform:rotate(1deg)}.figure-main img{box-shadow:none;transition:opacity .2s,transform .4s var(--ease)}.figure-main img.changing{opacity:.3;transform:translateY(10px)}.figure-caption{display:flex;justify-content:space-between;gap:20px;padding:10px 4px 0;color:var(--muted)}.specimen-controls{display:flex;align-items:center;justify-content:space-between;margin-top:28px;position:relative}.specimen-tabs{display:flex;gap:6px}.specimen-tabs button{background:none;border:1px solid transparent;font-size:12px;padding:7px 15px;border-radius:3px}.specimen-tabs button[aria-pressed=true]{border-color:var(--red);background:var(--rose);color:var(--red)}.specimen-controls>span{font:11px Manrope;color:var(--muted)}.figure-side{padding-left:10px}.detail{padding-bottom:125px}
.closing{background:var(--rose);overflow:hidden;border-top:0;padding:95px 0}.closing:after{content:'';position:absolute;width:440px;height:300px;right:8%;top:-30px;background:url(/static/public/8833ff60cd7af232b86e/reader-logo.svg) center/contain no-repeat;opacity:.045;transform:rotate(-13deg);pointer-events:none}.closing .wrap{position:relative;z-index:1}.closing h2{font-size:48px;line-height:1.28}.closing p{margin-top:20px}.closing .primary{background:var(--red)}
@media(max-width:900px){.material-plane{inset:110px 25px 42px 50px}.material-stroke{height:45px;top:40%}.note-layer{top:8px}.chapter-visual:before{font-size:140px;top:-22px;right:4%;opacity:.35}.chapter-visual:after{height:72%;top:17%}.manifesto{padding-bottom:65px}.detail-visual{grid-template-columns:1fr;gap:20px}.specimen{padding-top:20px}.figure-side{padding-left:0}.detail{padding-bottom:70px}.closing{padding:65px 0}.closing h2{font-size:34px}.closing:after{width:280px;right:-20%;top:20px}.steps-rail{display:none}}
@media(max-width:450px){.material-plane{inset:95px 12px 42px 40px}.material-stroke{height:37px;top:43%}.note-layer{padding:13px;width:151px}.chapter-visual:before{font-size:95px;top:-10px}.closing h2{font-size:29px}.specimen-tabs button{padding:6px 12px}.specimen-controls>span{font-size:10px}.hero h1 em:after{height:4px;bottom:-3px}}


/* Composition inspired by Codrops ScrollBasedLayoutAnimations and Scroll3DGrid.
   Original CSS timeline implementation; source references in 开源参考.md. */
.workspace-portal{display:none}
@keyframes stage-copy{0%,12%{opacity:1;transform:translateY(0)}35%,100%{opacity:0;transform:translateY(-115px)}}
@keyframes stage-paper{0%{opacity:1;transform:translate3d(0,0,0) rotate(-9deg)}32%{opacity:1;transform:translate3d(120px,100px,-260px) rotate(0deg)}58%,100%{opacity:0;transform:translate3d(-370px,-70px,-500px) rotateY(38deg) rotate(-12deg)}}
@keyframes stage-note{0%{opacity:1;transform:translate3d(0,0,80px) rotate(7deg)}32%{opacity:1;transform:translate3d(-100px,200px,0) rotate(-2deg)}58%,100%{opacity:0;transform:translate3d(320px,-160px,-320px) rotateY(-38deg) rotate(18deg)}}
@keyframes stage-slide{0%{opacity:1;transform:translate3d(0,0,0) rotate(4deg)}32%{opacity:1;transform:translate3d(-35px,-30px,70px) rotate(0deg) scale(.87)}55%,100%{opacity:0;transform:translate3d(-130px,-10px,0) rotateY(-10deg) scale(.65)}}
@keyframes stage-plane{0%{opacity:.65;transform:rotate(-13deg)}40%{opacity:.3;transform:rotate(0deg) scale(.7)}60%,100%{opacity:0;transform:rotate(10deg) scale(.3)}}
@keyframes stage-stroke{0%{opacity:.92;transform:rotate(-36deg)}35%{opacity:.5;transform:rotate(-5deg) scaleX(.6)}60%,100%{opacity:0;transform:translateX(-150px) rotate(0deg) scaleX(.3)}}
@keyframes stage-portal{0%,32%{opacity:0;transform:translate3d(23vw,70px,0) rotateY(-24deg) scale(.28)}43%{opacity:1}74%,100%{opacity:1;transform:translate3d(0,0,0) rotateY(0) scale(1)}}
@keyframes portal-title{0%,61%{opacity:0;transform:translateY(22px)}78%,100%{opacity:1;transform:translateY(0)}}
@keyframes stage-base{0%,24%{opacity:1}44%,100%{opacity:0}}
@keyframes reading-paper-depth{0%{transform:translate(-50px,65px) rotateY(15deg) rotate(-10deg) scale(.91)}22%{transform:translate(0,0) rotateY(0) rotate(-5deg) scale(1)}40%,100%{transform:translate(-140px,-110px) rotateY(25deg) rotate(-12deg) scale(.85)}}
@keyframes reading-note-depth{0%{transform:translate(80px,100px) rotate(8deg)}20%{transform:translate(0,0) rotate(0)}40%,100%{transform:translate(70px,-140px) rotate(-8deg)}}
@keyframes slide-depth{0%,27%{transform:translate(140px,150px) rotate(13deg) scale(.75)}43%,53%{transform:translate(0,0) rotate(-4deg) scale(1)}70%,100%{transform:translate(-110px,-160px) rotate(-12deg) scale(.9)}}
@keyframes editor-depth{0%,61%{transform:perspective(1500px) rotateY(-18deg) rotateX(5deg) scale(.85)}82%,100%{transform:perspective(1500px) rotateY(0) rotateX(0) scale(1)}}
@supports(animation-timeline:view()){@media(min-width:901px) and (prefers-reduced-motion:no-preference){
.hero-sequence{height:240vh;min-height:1850px;view-timeline-name:--hero;view-timeline-axis:block;position:relative}.hero-sequence .hero{position:sticky;top:0;height:100svh;max-height:none;min-height:700px;perspective:1700px;overflow:clip}.hero-copy{animation:stage-copy linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%}.hero-art{animation:none;transform-style:preserve-3d}.hero-art:before{animation:stage-base linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%}.paper-layer,.note-layer,.slide-layer,.material-plane,.material-stroke,.hero-bottom,.art-caption{animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--hero;animation-range:contain 0% contain 100%}.paper-layer{animation-name:stage-paper}.note-layer{animation-name:stage-note}.slide-layer{animation-name:stage-slide}.material-plane{animation-name:stage-plane}.material-stroke{animation-name:stage-stroke}.hero-bottom,.art-caption{animation-name:stage-base}
.workspace-portal{display:block;position:absolute;inset:65px 30px 55px;z-index:5;pointer-events:none;opacity:0;animation:stage-portal linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%;transform-origin:50% 55%}.portal-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 25px;animation:portal-title linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%}.portal-heading span{color:var(--red);font-size:15px}.portal-heading strong{font-size:29px;font-weight:600;letter-spacing:-.03em}.portal-window{position:relative;height:calc(100% - 65px);display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 20px 24px #30261614)}.portal-window img{max-height:100%;width:auto;max-width:100%;border:1px solid var(--line);border-radius:5px}.portal-border{position:absolute;inset:5% -15px -15px;border:1px solid var(--red);opacity:.2;z-index:-1;transform:rotate(-2deg)}
.reading-paper{animation:reading-paper-depth linear both;animation-timeline:--journey;animation-range:contain 0% contain 100%}.reading-note{animation:reading-note-depth linear both;animation-timeline:--journey;animation-range:contain 0% contain 100%}.loose-slide{animation:slide-depth linear both;animation-timeline:--journey;animation-range:contain 0% contain 100%}.editor-image{animation:editor-depth linear both;animation-timeline:--journey;animation-range:contain 0% contain 100%}
}}


@media(max-width:900px){.hero-art{overflow:clip}}
@supports not(animation-timeline:view()){@media(max-width:900px){.journey-inner{display:grid;grid-template-columns:1fr}.chapter-copy,.chapter-copy.first,.chapter-visual,.chapter-visual.first{width:100%;order:initial}}}
@media(prefers-reduced-motion:reduce){.workspace-portal{display:none}}

/* Current online reader capture, with the separate illustrative note retained. */
.reading-image{top:5%;width:110%;left:0;transform:rotate(-3deg)}
.chapter-visual.first .reading-note{top:auto;bottom:-3%;right:-3%;width:43%;padding:23px;z-index:2}
.chapter-visual.first .reading-note h3{font-size:19px}
.chapter-visual.first .reading-note p{font-size:13px;line-height:1.7}
.chapter-visual.first .reading-note footer{margin-top:15px;padding-top:12px}
@media(max-width:900px){.reading-image{top:0;width:100%;transform:rotate(-2deg)}.chapter-visual.first .reading-note{width:48%;right:0;bottom:0;padding:17px}.chapter-visual.first{aspect-ratio:1.25}.chapter-visual.first .reading-note h3{font-size:17px}.chapter-visual.first .reading-note p{font-size:12px}}
@media(max-width:450px){.chapter-visual.first{aspect-ratio:1.06}.chapter-visual.first .reading-note{width:65%;padding:14px}.chapter-visual.first .reading-note footer{margin-top:10px;padding-top:9px}}