*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;color:#191b1a;background:#f2f2f0}body{font-family:Arial,Helvetica,sans-serif;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}button:focus-visible,a:focus-visible{outline:1px solid currentColor;outline-offset:7px}button[hidden],[hidden]{display:none!important}a{color:inherit}header{position:fixed;top:0;left:0;width:100%;height:78px;z-index:20;display:flex;align-items:center;justify-content:center;pointer-events:none;transition:color .6s}header>*{pointer-events:auto}.signature{text-decoration:none;font-family:'Snell Roundhand','Apple Chancery','URW Chancery L',cursive;font-size:33px;font-style:italic;letter-spacing:-1.9px;line-height:1}.hamburger{display:inline-flex;flex-direction:column;gap:5px;width:17px;margin-right:10px}.hamburger i{height:1px;background:currentColor;width:17px;transition:transform .4s}#menu-toggle{position:absolute;left:27px;top:30px;font-size:12px;letter-spacing:1px;display:flex;align-items:center;padding:0}.close{position:absolute;right:25px;top:16px;background:white;color:#191b1a;width:42px;height:42px;font-size:27px;font-weight:200}.paper{position:fixed;inset:-8%;overflow:hidden;background:radial-gradient(ellipse at 50% 50%,#fff 0,#f4f4f2 53%,#e8e9e7 100%);pointer-events:none}.light{position:absolute;inset:-20%;filter:blur(12px);opacity:.6;mix-blend-mode:multiply;background:repeating-linear-gradient(165deg,transparent 0%,transparent 17%,#b8bab7 19%,#fafafa 22%,transparent 26%,transparent 42%);transform:rotate(-5deg);animation:light-flow 22s ease-in-out infinite alternate}.light-b{transform:rotate(11deg) scale(1.3);opacity:.4;animation-delay:-9s;background:repeating-linear-gradient(11deg,transparent 0%,transparent 27%,#b9bbb9 30%,#fff 34%,transparent 39%,transparent 66%)}.light-c{opacity:.4;filter:blur(6px);transform:rotate(-8deg);background:repeating-linear-gradient(174deg,transparent 0%,transparent 22%,#bfc2be 28%,white 32%,transparent 37%,transparent 60%);animation-delay:-15s}.grain{position:absolute;inset:0;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' opacity='.7' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}#home{position:relative;width:100%;height:100svh;min-height:480px;transition:opacity .7s}#scene{position:absolute;inset:0}#scene canvas{display:block;width:100%;height:100%}#stone-targets{position:absolute;inset:0;pointer-events:none}.stone-target{position:absolute;transform:translate(-50%,-50%);width:100px;height:110px;pointer-events:auto;border-radius:30%;background:transparent}.stone-target:focus-visible{outline-offset:5px}#hover-label{position:absolute;top:68%;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:1.6px;text-transform:uppercase;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .4s}#hover-label.visible{opacity:1}.chapters{position:absolute;right:22px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px}.chapters button{border:1px solid #b1b2ae;border-radius:50%;font:25px 'Times New Roman',serif;width:41px;height:41px;opacity:.25;transition:opacity .4s,border-color .4s}.chapters button[aria-pressed=true]{opacity:1;border-color:#777}.editorial{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);text-align:center;pointer-events:none}.editorial h1{font-family:'Bodoni 72','Didot','Times New Roman',serif;font-weight:400;font-size:clamp(47px,5vw,74px);letter-spacing:-3px;line-height:.86;margin:0 0 22px;white-space:nowrap}.title-first{display:block;transform:translateX(-28px)}.title-first em{font-size:.58em;font-weight:400;letter-spacing:-2px}.title-second{display:block;transform:translateX(29px)}.editorial p{font:12px 'Bodoni 72','Didot','Times New Roman',serif;margin:0}dialog{max-width:none;max-height:none;border:0;padding:0;margin:0;inset:0;width:100%;height:100svh;color:inherit}dialog::backdrop{background:transparent}#menu{background:rgba(246,246,243,.97);z-index:15}.menu-inner{padding:130px 12% 30px;height:100%;display:flex;flex-direction:column}.menu-inner nav{display:flex;flex-direction:column;align-items:flex-start;gap:16px}.menu-inner nav button{font:clamp(35px,5vw,65px) 'Didot','Times New Roman',serif;transition:opacity .3s}.menu-inner nav button:hover{opacity:.45}.menu-footer{margin-top:auto;border-top:1px solid #cdceca;padding-top:22px;font:22px 'Didot',serif;display:flex;justify-content:space-between}.menu-footer span{font:10px Arial;letter-spacing:2px}#menu-copy{position:absolute;left:55%;top:27%;max-width:30%}#menu-copy h2{font:36px 'Didot',serif}#menu-copy p{font:15px/1.8 Arial;white-space:pre-line}#menu-copy a{font-size:13px}body.menu-open .hamburger i:first-child{transform:translateY(3px) rotate(45deg)}body.menu-open .hamburger i:last-child{transform:translateY(-3px) rotate(-45deg)}#project{background:var(--project-color,#1b5f49);color:#fff;overflow-y:auto;scroll-behavior:smooth;z-index:10}#project:before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 30% 20%,#ffffff60,transparent 55%),linear-gradient(130deg,#fff2,transparent 45%,#0004);z-index:-1}.project-hero{height:100svh;position:relative;overflow:hidden;min-height:480px}#project-gem{position:absolute;top:13%;left:50%;transform:translateX(-50%);width:min(55vw,340px);height:43vh;border-radius:24%;background:radial-gradient(ellipse at 26% 20%,#fff9,transparent 24%),radial-gradient(ellipse at 70% 80%,#fff6,transparent 35%),linear-gradient(140deg,#fff7,#0004 45%,#fff4 64%,#0006);box-shadow:inset 4px 5px 8px #fff7,inset -7px -7px 8px #0016,22px 30px 30px #0004;filter:drop-shadow(0 0 28px #fff3);animation:gem-float 7s ease-in-out infinite}.project-heading{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);text-align:center;width:80%}.project-heading h2{font-weight:400;letter-spacing:3px;font-size:28px;line-height:1.2;min-height:68px}.project-heading button{font-size:11px;letter-spacing:2px}.project-heading button span{display:flex;width:43px;height:43px;align-items:center;justify-content:center;margin:18px auto 0;border:1px solid #ffffff50;border-radius:50%;font-size:21px}#project-detail{min-height:100svh;padding:15vh 15%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:45px}#project-description{max-width:620px;font:clamp(24px,4vw,44px)/1.4 'Didot','Times New Roman',serif;white-space:pre-line}#project-image{width:min(100%,900px);height:auto}#project-link,#next-project{font-size:11px;letter-spacing:2px;text-decoration:none;border-bottom:1px solid #fff6;padding:15px}body.project-open header{color:white}body.project-open #home{opacity:0;pointer-events:none}@keyframes light-flow{to{translate:3% 5%;rotate:4deg}}@keyframes gem-float{50%{translate:0 -10px;rotate:1deg}}@media(min-width:900px){.editorial{bottom:35px}.editorial h1{font-size:64px}.chapters{right:34px}header{height:86px}.signature{font-size:37px}#menu-toggle{left:33px;top:35px}.stone-target{width:125px;height:135px}}@media(max-width:480px){header{height:65px}.signature{font-size:28px}#menu-toggle{left:17px;top:26px;font-size:10px}.hamburger{width:13px;margin-right:7px}.hamburger i{width:13px}.chapters{right:14px;gap:10px}.chapters button{width:34px;height:34px;font-size:21px}.editorial{bottom:29px}.editorial h1{font-size:51px}.stone-target{width:83px;height:93px}.close{right:13px;top:13px;width:36px;height:36px}.menu-inner{padding-top:110px}#menu-copy{position:static;max-width:100%}#menu-copy h2{font-size:26px}#project-gem{width:45vw;height:30vh;top:24%}.project-heading h2{font-size:24px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* A project and the original stones share the same native document scroll. */
html,body{height:auto;min-height:100%;overflow-x:clip;overflow-y:auto;overflow-anchor:none}body.menu-open{overflow:hidden}body.project-open #home{opacity:1;pointer-events:auto}#home{isolation:isolate;outline:0}.paper{z-index:0}header{z-index:40}#project{position:relative;inset:auto;max-width:none;width:100%;height:auto;max-height:none;margin:0;padding:0;overflow:visible;background:var(--project-color);color:#fff;z-index:2}#project:before{position:absolute;z-index:-1;background:radial-gradient(ellipse at 25% 10%,#ffffff40,transparent 30%),radial-gradient(ellipse at 80% 30%,#0003,transparent 45%);pointer-events:none}body.project-open header{color:#191b1a}body.light-header header{color:white}#ink-transition{position:fixed;inset:0;z-index:70;pointer-events:auto}#ink-transition canvas{width:100%;height:100%;display:block}.project-hero{height:100svh}.demo-label{position:absolute;top:105px;left:50%;transform:translateX(-50%);font-size:8px;letter-spacing:2px;white-space:nowrap;opacity:.7}#project-gem{top:21%;width:clamp(130px,20vw,240px);height:clamp(135px,23vw,250px);border-radius:23%;background:radial-gradient(ellipse at 24% 17%,#ffffffe0,transparent 10%),radial-gradient(ellipse at 67% 75%,#fff5,transparent 36%),linear-gradient(130deg,#fff3,transparent 28%,#0005 60%,#fff5);transform:translateX(-50%) rotate(-5deg);box-shadow:inset 3px 4px 7px #fff9,inset -5px -5px 10px #0008,25px 35px 40px #0004}.project-heading{bottom:40px}.project-heading h2{font:clamp(46px,6vw,82px)/1.05 'Didot','Times New Roman',serif;letter-spacing:-2px;margin:12px 0 25px;min-height:0;outline:none}.project-heading>p{font-size:10px;letter-spacing:3px;text-transform:uppercase}.project-heading button{font-size:10px}.ink-section{height:185svh;position:relative;contain:paint}#project-detail{display:block;min-height:0;padding:0;text-align:left}.story-sticky{position:sticky;top:0;min-height:100svh;display:grid;grid-template-columns:.85fr 1.25fr;align-items:center;gap:7vw;padding:9vh 7vw}.story-copy{max-width:420px}.story-copy .eyebrow{font-size:9px;letter-spacing:2.5px;margin:0 0 30px;opacity:.7}.story-copy h3{font:clamp(40px,4.5vw,68px)/1.05 'Didot','Times New Roman',serif;font-weight:400;letter-spacing:-1.7px;margin:0 0 30px}.story-copy h3 em{font-weight:400}.story-copy>p:not(.eyebrow):not(.ink-instruction){font:14px/1.9 Arial,Helvetica,sans-serif;letter-spacing:.15px;max-width:370px;margin:0}.story-copy #project-description{font:14px/1.9 Arial,Helvetica,sans-serif}.ink-instruction{font-size:8px;letter-spacing:1.6px;margin:35px 0 0;opacity:.6}.artwork-wrap{width:100%;transform:rotate(-3deg);filter:drop-shadow(18px 26px 30px #0003)}.ink-artwork{aspect-ratio:4/3;width:100%;background-size:cover;background-color:#f3f0e8}.ink-artwork canvas{width:100%;height:100%;display:block}#project-process{background:#efeee9;color:#20221e}#project-process .story-sticky{grid-template-columns:1.25fr .85fr}#project-process .artwork-wrap{transform:rotate(3deg)}.story-copy .project-note{margin-top:30px!important;font-size:10px!important;opacity:.55}.journey-end{height:55svh;min-height:300px;background:linear-gradient(#efeee9,#f2f2f0);color:#252824;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.journey-end>p{font:italic clamp(30px,4vw,55px) 'Didot',serif;margin:0 20px 35px}.journey-end button{font-size:9px;letter-spacing:2px}.journey-end span{display:block;font-size:28px;font-weight:200;margin-top:25px}#menu{z-index:35}body.menu-open header{color:#191b1a}.close{z-index:1}#hover-label{top:65%;z-index:3;font-size:10px;letter-spacing:2.5px}.editorial{z-index:2}#scene{z-index:-1}#stone-targets{z-index:1}@media(min-width:800px){.editorial h1{font-size:84px;line-height:.85}.editorial{bottom:40px}.editorial p{font-size:15px}.title-first{transform:translateX(-50px)}.title-second{transform:translateX(50px)}}@media(max-width:799px){.ink-section{height:185svh}.story-sticky,#project-process .story-sticky{grid-template-columns:1fr;gap:28px;align-content:center;padding:85px 8vw 35px}.story-copy{max-width:100%}.story-copy h3{font-size:39px;letter-spacing:-1px;margin-bottom:18px}.story-copy>p:not(.eyebrow):not(.ink-instruction),.story-copy #project-description{font-size:12px;line-height:1.7;max-width:100%}.story-copy .eyebrow{margin-bottom:18px;font-size:8px}.ink-instruction{margin-top:18px;font-size:7px}.artwork-wrap{width:88%;margin:0 auto}.story-copy .project-note{margin-top:15px!important}.demo-label{font-size:6px;letter-spacing:1.5px;top:85px}.project-heading h2{font-size:49px}.project-heading{bottom:35px}#project-gem{width:140px;height:150px;top:25%}.journey-end{height:45svh}.journey-end>p{font-size:31px}}@media(prefers-reduced-motion:reduce){.ink-instruction{opacity:0}}
/* Keep sticky scenes attached to the document viewport, not a body scroll box. */
body{overflow:visible}html{overflow-x:clip;overflow-y:auto}html:has(body.menu-open){overflow:hidden}
/* Paper relief remains in the scene and becomes clearer around a hovered stone. */
.grain{background-image:url('./assets/paper-grain.svg');background-size:240px 240px;opacity:.19;mix-blend-mode:multiply}
.paper-focus{position:fixed;inset:0;z-index:3;pointer-events:none;background-image:url('./assets/paper-grain.svg');background-size:240px 240px;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse 290px 260px at var(--hover-x,50%) var(--hover-y,44%),#000 15%,transparent 85%);opacity:0;transition:opacity 1.2s ease}
body.stone-hover .paper-focus{opacity:.48;animation:paper-breath 6s ease-in-out infinite}
@keyframes paper-breath{0%,100%{opacity:.38}50%{opacity:.6}}
#project-gem.photographic-gem{background-color:transparent;background-position:center;background-size:contain;background-repeat:no-repeat;border-radius:0;box-shadow:none;filter:drop-shadow(20px 27px 18px #0005);width:clamp(170px,26vw,300px);height:clamp(170px,26vw,300px);transform:translateX(-50%) rotate(-3deg)}
@media(max-width:799px){#project-gem.photographic-gem{width:190px;height:190px}}
@media(prefers-reduced-motion:reduce){body.stone-hover .paper-focus{animation:none;opacity:.48}}
.paper-focus{z-index:0}
/* Independent depth for the paper, broad shadows, highlights and fine grain. */
.paper{transform:translate3d(var(--paper-x,0px),var(--paper-y,0px),0)}
.light-a{transform:translate3d(var(--light-a-x,0px),var(--light-a-y,0px),0) rotate(-5deg)}
.light-b{transform:translate3d(var(--light-b-x,0px),var(--light-b-y,0px),0) rotate(11deg) scale(1.3)}
.light-c{transform:translate3d(var(--light-c-x,0px),var(--light-c-y,0px),0) rotate(-8deg)}
.grain{inset:-8px;transform:translate3d(var(--grain-x,0px),var(--grain-y,0px),0)}
@media(prefers-reduced-motion:reduce){.paper,.light,.grain{transform:none}}
