:root{color-scheme:dark;--ink:#f2eadb;--muted:#c4bbaa;--floor:#171713;--line:#5c594d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--floor);color:var(--ink);font-family:Inter,sans-serif;font-size:15px}::selection{background:#d2b787;color:#171713}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:.25em}button,input{font:inherit}.skip{position:absolute;z-index:20;left:1rem;top:-5rem;background:var(--ink);color:var(--floor);padding:1rem}.skip:focus{top:1rem}:focus-visible{outline:2px solid #e5bc78;outline-offset:4px}.experience{min-height:100svh;position:relative;display:grid;grid-template-columns:1fr minmax(380px,1.5fr) 1fr;grid-template-rows:auto 1fr auto;overflow:hidden;background:#171713}.site-header{position:relative;z-index:2;grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:28px 4vw}.artist{font-family:Fraunces,serif;font-size:1.35rem}.back{font-size:.8rem}.heading{position:relative;z-index:2;align-self:center;padding-left:4vw;pointer-events:none}.heading h1,.source h2{font-family:Fraunces,serif;font-weight:300;letter-spacing:-.035em;line-height:.97;margin:0;font-size:clamp(3rem,5vw,5.8rem)}em{font-weight:300}.heading p{color:var(--muted);line-height:1.6;margin:1.6rem 0 0}.art-stage{position:absolute;inset:0;overflow:hidden;touch-action:none;background:radial-gradient(ellipse at center,#302d24 0%,#171713 68%)}#art-canvas,#art-fallback{width:100%;height:100%;position:absolute;inset:0}#art-fallback{object-fit:contain;object-position:center;opacity:.72;padding:10vh 0 18vh}#art-canvas{display:none}body[data-renderer="webgpu"] #art-canvas{display:block}body[data-renderer="webgpu"] #art-fallback{display:none}.invitation{z-index:2;grid-column:3;align-self:end;justify-self:end;padding:0 4vw 2rem 1rem;line-height:1.55;font-size:.85rem}.invitation p{margin:0 0 2rem}.invitation span{color:var(--muted)}.invitation a{border-bottom:1px solid var(--line);padding-bottom:.5rem}#study-controls{position:relative;z-index:3;grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:1rem 5vw;align-items:center;background:#24241e;border-top:1px solid #514f43;padding:1.3rem 4vw}.actions{display:flex;gap:.5rem;flex-wrap:wrap}button{border:1px solid #888170;color:var(--ink);background:transparent;padding:.65rem 1rem;min-height:44px;cursor:pointer}button:hover:not(:disabled){background:var(--ink);color:var(--floor)}button:disabled{opacity:.5;cursor:wait}#play{background:#e8d6b6;color:#1b1a15;border-color:#e8d6b6;min-width:86px}.sliders{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5vw}.control label{display:flex;justify-content:space-between;font-size:.75rem;gap:1rem}.control output{color:var(--muted);font-variant-numeric:tabular-nums}.control input{width:100%;accent-color:#d7b88d;min-height:32px;cursor:pointer}.status{grid-column:1/-1;display:flex;gap:1rem;justify-content:space-between;color:var(--muted);font-size:.75rem;line-height:1.5}.source{display:grid;grid-template-columns:1fr 1fr;gap:9vw;padding:clamp(5rem,10vw,10rem) 9vw;background:#ded5c4;color:#29271f}.source-copy{max-width:38rem}.source h2{font-size:clamp(3rem,5vw,5rem);margin-bottom:2.5rem}.source p{line-height:1.8;max-width:48ch;color:#514b40}.source figure{margin:0}.source img{display:block;width:100%;height:auto}.source figcaption{display:flex;justify-content:space-between;gap:1rem;margin-top:1rem;font-size:.8rem}.source figcaption span{color:#514b40}footer{display:flex;justify-content:space-between;gap:2rem;padding:2rem 4vw;color:var(--muted);font-size:.8rem}footer a:first-child{font-family:Fraunces,serif;font-size:1.2rem;color:var(--ink)}@media(max-width:900px){.experience{min-height:100svh;display:flex;flex-direction:column;overflow:visible}.site-header{padding:20px}.heading{padding:0 20px;margin-top:1.5rem;align-self:auto}.heading h1{font-size:3rem}.heading p{font-size:.8rem;margin-top:.8rem}.art-stage{position:relative;inset:auto;min-height:44vh;flex:1;margin-top:-1rem}#art-fallback{padding:1rem}.invitation{align-self:auto;padding:0 20px 1.3rem;display:flex;align-items:end;justify-content:space-between}.invitation p{margin:0}.invitation a{white-space:nowrap}#study-controls{display:block;padding:1rem 20px}.sliders{gap:1rem;margin-top:1rem}.status{display:block;margin-top:.5rem}.status span{display:block}.source{grid-template-columns:1fr;gap:3rem;padding:5rem 20px}.source figcaption{flex-direction:column;gap:.3rem}footer{padding:2rem 20px}.back{font-size:.75rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.heading h1,.invitation p{color:var(--ink)}.heading h1{text-shadow:0 2px 20px rgba(0,0,0,.6)}.source h2{color:#29271f}
.control{min-width:0}.control input{min-width:0}.sliders{grid-template-columns:repeat(3,minmax(0,1fr))}

.art-stage{touch-action:none}.control input[type=range]{min-height:44px}
