:root{--page:#e7ece5;--paper:#e9e8db;--ink:#254a43;--muted:#4b625b;--line:#b7c7bc;--pink:#cd9db1;color-scheme:light;font-family:Inter,sans-serif;color:var(--ink);background:var(--page);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:.25em}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{color:inherit}::selection{background:#cd9db1;color:#173c36}:focus-visible{outline:2px solid #254a43;outline-offset:5px}html{scrollbar-color:#4f8581 #e7ece5;scrollbar-width:thin}.skip-link{position:fixed;top:10px;left:20px;z-index:10;padding:14px;background:var(--paper);transform:translateY(-180%)}.skip-link:focus{transform:translateY(0)}
.site-header{height:96px;max-width:1640px;margin:auto;padding:0 4vw;display:flex;align-items:center;justify-content:space-between}.signature{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:Fraunces,serif;font-size:24px;letter-spacing:-.03em}.signature img{width:37px;height:37px;object-fit:contain}.back-link{display:flex;align-items:center;gap:10px;min-height:44px;font-size:14px;text-decoration:none}.back-link:hover{text-decoration:underline}.back-link svg,footer svg{width:20px;stroke:currentColor;stroke-width:1.3}
main{max-width:1640px;margin:auto;padding:14px 4vw 0}.work{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:clamp(36px,4.5vw,88px);align-items:start}.artwork{margin:0;min-width:0}.art-stage{height:calc(100svh - 190px);min-height:530px;max-height:850px;position:relative;overflow:hidden;background:var(--paper);isolation:isolate}.art-stage canvas,.art-fallback{display:block;position:absolute;inset:0;width:100%;height:100%}.art-stage canvas{opacity:0;pointer-events:none}body[data-renderer=webgpu] .art-stage canvas{opacity:1}body[data-renderer=webgpu] .art-fallback{visibility:hidden}.art-caption{display:flex;justify-content:space-between;gap:24px;font-size:14px;line-height:1.6;margin-top:16px;color:var(--muted)}.art-caption>span:first-child{max-width:43ch}.art-caption>span:last-child{font-size:14px;flex-shrink:0;text-align:right;max-width:180px}.editorial{padding-top:24px}.introduction h1{font-family:Fraunces,serif;font-weight:300;font-size:clamp(48px,4.2vw,70px);line-height:1.02;letter-spacing:-.04em;margin:0 0 20px}.lead{font-family:Fraunces,serif;font-size:24px;line-height:1.25;letter-spacing:-.02em;margin:0 0 18px}.description{font-size:14px;line-height:1.8;margin:0;max-width:32ch}.controls{margin-top:clamp(34px,5vh,74px)}.control{margin-bottom:23px}.control label{display:flex;justify-content:space-between;align-items:center;font-size:14px;line-height:1.5}.control output{font-variant-numeric:tabular-nums;color:var(--muted);font-size:14px;min-width:3ch;text-align:right}.control input{display:block;appearance:none;-webkit-appearance:none;width:100%;height:44px;background:transparent;cursor:pointer;margin:2px 0 -4px;accent-color:#28554e}.control input::-webkit-slider-runnable-track{height:1px;background:#6b8a7d}.control input::-moz-range-track{height:1px;background:#6b8a7d}.control input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;margin-top:-7px;width:15px;height:15px;border-radius:50%;background:#28554e;border:3px solid var(--page);box-shadow:0 0 0 1px #28554e}.control input::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:#28554e;border:3px solid var(--page);box-shadow:0 0 0 1px #28554e}.control input:hover::-webkit-slider-thumb{background:#a34f65;box-shadow:0 0 0 1px #a34f65}.range-ends{display:flex;justify-content:space-between;font-size:14px;color:var(--muted)}.actions{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:30px}.actions button{min-height:44px;border:0;cursor:pointer;font-size:14px}.play-button{display:flex;align-items:center;gap:9px;background:var(--ink);color:#f1f0e4;padding:10px 17px}.play-button svg{width:15px;height:15px;fill:currentColor}.play-button:hover{background:#34665a}.play-button:disabled{opacity:.55;cursor:not-allowed}.reset-button{padding:8px 0;background:transparent;text-decoration:underline;text-underline-offset:5px}.reset-button:hover{color:#843c54}.motion-note{font-size:14px;line-height:1.7;color:var(--muted);margin:16px 0 0;min-height:40px}.references{margin-top:clamp(90px,12vw,180px);padding:58px 0 72px;border-top:1px solid var(--line);display:grid;grid-template-columns:.8fr 1fr 1fr;gap:clamp(28px,4vw,64px)}.references h2{font-family:Fraunces,serif;font-weight:300;font-size:36px;line-height:1.15;letter-spacing:-.03em;margin:0 0 24px}.references p{font-size:14px;line-height:1.8;max-width:31ch;margin:0}.references figure{margin:0}.references img{display:block;width:100%;height:auto;aspect-ratio:1.15;object-fit:cover}.references figcaption{margin-top:16px;display:grid;gap:6px;font-size:14px;line-height:1.6}.references figcaption>span:last-child{font-size:14px;color:var(--muted)}footer{margin:0 auto;max-width:1640px;padding:30px 4vw 42px;display:flex;justify-content:space-between;gap:24px;border-top:1px solid var(--line);font-size:14px}footer>span{font-family:Fraunces,serif;font-size:22px}footer nav{display:flex;gap:32px}footer a{display:flex;align-items:center;gap:10px;min-height:44px;text-decoration:none}footer a:hover{text-decoration:underline}
@media(min-width:1500px){.work{grid-template-columns:minmax(0,1fr) 285px}.editorial{padding-top:40px}}
@media(max-width:1050px){.work{grid-template-columns:minmax(0,1fr) 230px;gap:32px}.site-header{height:82px}.art-stage{min-height:550px;height:calc(100svh - 170px)}.introduction h1{font-size:50px}.lead{font-size:22px}.art-caption{flex-direction:column;gap:3px}.art-caption>span:last-child{text-align:left;max-width:none}.controls{margin-top:28px}.references{grid-template-columns:1fr 1fr}.reference-intro{grid-column:1/-1;display:flex;gap:50px;align-items:start}.reference-intro h2{flex:1}.reference-intro p{flex:1;max-width:40ch}}
@media(max-width:720px){.site-header{height:76px;padding:0 6vw}.signature{font-size:21px;gap:9px}.signature img{width:30px;height:30px}.back-link{font-size:14px;gap:6px}.back-link svg{width:17px}main{padding:15px 6vw 0}.work{display:flex;flex-direction:column;gap:0}.editorial{display:contents}.introduction{order:-1;margin:0 0 24px;display:grid;grid-template-columns:1fr auto;column-gap:20px;align-items:baseline;width:100%}.introduction h1{font-size:43px;margin:0;letter-spacing:-.04em}.lead{font-size:18px;margin:0}.description{grid-column:1/-1;font-size:14px;line-height:1.6;max-width:48ch;margin:12px 0 0}.artwork{width:100%}.art-stage{height:54svh;min-height:330px;max-height:650px}.art-caption{font-size:14px;gap:6px;margin-top:13px}.art-caption>span:first-child{max-width:48ch}.art-caption>span:last-child{font-size:14px}.controls{width:100%;margin-top:36px;display:grid;grid-template-columns:1fr 1fr;gap:18px 28px}.control{margin-bottom:0}.control:nth-child(3){grid-column:1/-1;max-width:100%;width:100%}.actions{margin:0;grid-column:1/-1;justify-content:flex-start;gap:30px}.motion-note{grid-column:1/-1;margin:-5px 0 0;min-height:0}.references{margin-top:76px;padding-top:38px;gap:28px 20px}.reference-intro{display:block}.references h2{font-size:32px;margin-bottom:20px}.references p{max-width:48ch}.references img{aspect-ratio:.8}.references figcaption{font-size:14px;margin-top:12px}.references figcaption>span:last-child{font-size:14px}footer{margin:0 6vw;padding:26px 0 30px;flex-direction:column;gap:15px}footer nav{flex-direction:column;gap:0;align-items:flex-start}}
@media(max-width:390px){.introduction{grid-template-columns:1fr;gap:10px}.lead{font-size:18px}.description{display:none}.introduction h1{font-size:40px}.art-stage{min-height:310px}.controls{grid-template-columns:1fr;gap:22px}.control:nth-child(3){grid-column:auto}.references{grid-template-columns:1fr}.reference-intro{grid-column:auto}.references img{aspect-ratio:1.15}.back-link{font-size:14px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}