@font-face{font-family:'Aileron';src:url('/assets/fonts/aileron-regular.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Studio Garamond';src:local('Baskerville');font-display:swap}
:root{--blue:#0636d4;--ink:#fff1d9;--muted:#c5d3fb;--serif:'Studio Garamond',Baskerville,'Palatino Linotype','Book Antiqua',Palatino,Georgia,serif;font-family:var(--serif);color:var(--ink);background:var(--blue);font-synthesis:none;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--ink);outline-offset:7px}button{border:0}button[hidden],[hidden]{display:none!important}.filter-definitions{position:absolute;width:0;height:0;pointer-events:none}.blue-ground{position:fixed;inset:0;z-index:-2;pointer-events:none}.blue-ground svg{width:100%;height:100%;display:block}.blue-ground:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 45% 32%,transparent 20%,#00117d33 100%)}.site{min-height:100svh;display:flex;flex-direction:column}.site-header{position:relative;z-index:4;display:flex;align-items:flex-start;justify-content:space-between;padding:34px 4.4vw 0}.wordmark{position:relative;font-size:32px;line-height:.9;letter-spacing:-1.5px}.wordmark span{display:block;font-size:25px;font-style:italic;letter-spacing:-.7px;margin-top:7px}.wordmark i{font-size:28px;position:absolute;left:116px;top:1px;font-weight:normal;font-style:normal}.site-header nav{display:flex;gap:36px;padding-top:8px}.nav-link{font-size:17px;padding-bottom:7px;border-bottom:1px solid transparent}.nav-link:hover,.nav-link[aria-current=page]{border-color:#fff1d978}.nav-link span{font-size:12px;margin-left:10px;color:var(--muted)}main{flex:1;display:grid}.garden{display:flex;align-items:center;justify-content:center;overflow:hidden;margin-top:-65px}.scene{position:relative;width:100%;max-width:1560px;aspect-ratio:1440 / 870;min-height:640px}.totems{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;filter:url(#blue-knockout);opacity:0;pointer-events:none;mask-image:linear-gradient(120deg,transparent 0%,transparent 30%,black 45%)}.branches{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.branch text{font-family:'Courier New',monospace;font-size:13px;fill:#f2e5c7;opacity:.7}.fruit{position:absolute;margin:0;left:var(--x);top:var(--y);width:var(--w);padding:0;background:transparent;text-align:left;transform:rotate(var(--tilt));transition:transform .5s cubic-bezier(.2,.7,.2,1);z-index:2}button.fruit:hover{transform:rotate(0deg) translateY(-7px);z-index:3}.fruit-frame{position:relative;display:block;aspect-ratio:1.65;border:1px solid #edecde9c;background:#0636ce80;box-shadow:0 5px 22px #00177524;padding:13px;overflow:hidden;transition:background .35s,box-shadow .35s}button.fruit:hover .fruit-frame{background:#042db3cc;box-shadow:0 8px 25px #00126d50}.fruit:nth-child(2) .fruit-frame,.fruit:nth-child(5) .fruit-frame{background:#153fbb88}.fruit:nth-child(3) .fruit-frame,.fruit:nth-child(7) .fruit-frame{background:#0525a17a}.study-art{display:block;width:100%;height:100%;overflow:hidden;opacity:.88}.study-label{position:absolute;bottom:7px;left:10px;font-style:italic;font-size:12px;color:#d9e1fcbd}.fruit-open{position:absolute;right:9px;bottom:5px;font-size:19px;opacity:0;transition:opacity .2s}button.fruit:hover .fruit-open,.fruit:focus-visible .fruit-open{opacity:1}.fruit-caption{font-family:'Aileron',sans-serif;font-weight:400;display:flex;justify-content:space-between;align-items:center;font-size:16px;padding:9px 3px 0}.fruit-caption>span:last-child{font-size:12px;color:var(--muted);letter-spacing:.05em}.deer-link{position:absolute;left:3.4%;top:60.4%;width:25%;z-index:3;transform-origin:50% 70%}.deer{display:block;width:100%;overflow:visible;transition:filter .5s,transform .5s}.deer-link:hover .deer{filter:drop-shadow(0 0 12px #ffeec236);transform:translateY(-3px)}.deer-caption{position:absolute;bottom:-6px;left:28%;width:max-content;max-width:100%;font-style:italic;font-size:15px;transform:rotate(-5deg);color:var(--muted)}.deer-caption span{margin-left:14px}.site-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:12px 4.4vw 27px;font-size:14px;color:var(--muted);z-index:4}.site-footer button{background:transparent;padding:7px;font-size:14px}.site-footer button span{margin-right:7px;font-size:18px}.footer-index{font-style:italic}.skip-intro{position:fixed;bottom:26px;right:4.4vw;background:none;padding:10px;font-size:15px;z-index:6}.skip-intro span{margin-left:12px}.work-dialog{padding:0;border:0;background:transparent;color:var(--ink);max-width:none;max-height:90svh;width:min(980px,88vw)}.work-dialog::backdrop{background:#02145988;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}
@media(min-width:1650px){.scene{max-width:1600px}.site-header{padding-top:45px}.site-footer{padding-bottom:32px}}
@media(max-width:1000px) and (min-width:701px){.scene{min-height:580px}.fruit-caption{font-size:14px}.deer-caption{font-size:13px}.garden{margin-top:-30px}}
@media(max-width:700px){.site-header{padding:25px 25px 0}.wordmark{font-size:28px}.wordmark span{font-size:22px}.wordmark i{left:102px;font-size:24px}.site-header nav{gap:19px}.nav-link{font-size:15px}.nav-link span{display:none}.garden{margin-top:0}.scene{aspect-ratio:auto;min-height:1360px;max-width:460px}.branches{display:none}.fruit{width:42%;left:var(--mobile-x);top:var(--mobile-y);transform:rotate(calc(var(--tilt) * .65))}.fruit:nth-child(1){--mobile-x:7%;--mobile-y:10%}.fruit:nth-child(2){--mobile-x:52%;--mobile-y:20%}.fruit:nth-child(3){--mobile-x:6%;--mobile-y:33%}.fruit:nth-child(4){--mobile-x:52%;--mobile-y:44%}.fruit:nth-child(5){--mobile-x:7%;--mobile-y:57%}.fruit:nth-child(6){--mobile-x:52%;--mobile-y:68%}.fruit:nth-child(7){--mobile-x:7%;--mobile-y:79%}.fruit-caption{font-size:16px}.deer-link{left:3%;top:21%;width:42%}.deer-caption{font-size:13px;left:5%;bottom:-12px}.site-footer{padding:37px 25px 24px;flex-wrap:wrap;gap:10px;font-size:13px}.site-footer .footer-index{display:none}.site-footer button{font-size:13px}.footer-note{max-width:155px}.study-label{font-size:12px}.fruit-frame{padding:9px}.skip-intro{right:20px}.totems{object-fit:cover;height:650px;mask-image:linear-gradient(transparent,black 15%,black 65%,transparent)}.work-dialog{width:92vw}}

/* The opening is a single finite sequence. The finished garden stays still. */
.prelude .site-header,.prelude .site-footer,.prelude .fruit,.prelude .branches,.prelude .mobile-branches,.prelude .deer-caption{opacity:0;visibility:hidden}
.prelude .deer-link{transform:translate(-180%,40px);opacity:0}
.intro .site-header{animation:reveal-ui 2s 12s both}
.intro .site-footer{animation:reveal-ui 1.8s var(--intro-tail) both}
.intro .deer-link{animation:deer-arrives 5.2s cubic-bezier(.18,.6,.25,1) both}
.intro .deer{animation:deer-step 1.1s ease-in-out 4}
.intro .deer-caption{animation:reveal-ui 1.8s var(--intro-tail) both}
.intro .totems{animation:totems-appear 6.5s 2.5s both}
.intro .branch text{animation:symbol-grows 1.6s calc(6.4s + var(--grow-delay)) cubic-bezier(.25,.1,.3,1) both}
.intro .fruit{animation:fruit-appears 2.1s var(--fruit-delay) both}
@keyframes deer-arrives{0%{transform:translate(-145%,36px) rotate(-5deg);opacity:0}10%{opacity:1}48%{transform:translate(-34%,3px) rotate(1deg)}100%{transform:translate(0,0) rotate(0);opacity:1}}
@keyframes deer-step{0%,100%{transform:translateY(0) rotate(-.7deg)}50%{transform:translateY(-7px) rotate(.7deg)}}
@keyframes totems-appear{0%{opacity:0;filter:url(#blue-knockout) blur(9px);transform:scale(1.015)}28%{opacity:.75;filter:url(#blue-knockout) blur(0)}52%{opacity:.65;filter:url(#blue-knockout) blur(.2px)}100%{opacity:0;filter:url(#blue-knockout) blur(17px);transform:scale(1.045)}}
@keyframes symbol-grows{0%{opacity:0}45%{opacity:calc(var(--glyph-opacity) * .45)}100%{opacity:var(--glyph-opacity)}}
@keyframes fruit-appears{from{opacity:0;filter:blur(7px);transform:translateY(-13px) rotate(calc(var(--tilt) - 5deg)) scale(.92)}to{opacity:1;filter:blur(0);transform:translateY(0) rotate(var(--tilt)) scale(1)}}
@keyframes reveal-ui{from{opacity:0}to{opacity:1}}
.mobile-branches{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.mobile-branches text{font-family:'Courier New',monospace;font-size:12px;fill:#f2e5c7;opacity:.7}
.fruit-frame{background:#0d35c8ed}
.fruit:nth-child(2) .fruit-frame,.fruit:nth-child(5) .fruit-frame{background:#1238c4ed}
.fruit:nth-child(3) .fruit-frame,.fruit:nth-child(7) .fruit-frame{background:#082fc0ed}
.cover-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cover-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none;transition:opacity .6s ease}
.is-previewing .cover-video{opacity:1}
.fruit:has(.cover-image) .study-label{background:#0c232cc9;padding:3px 6px;left:6px;bottom:5px;border-radius:2px;color:#f7ebcde0}
.fruit:has(.cover-image) .fruit-open{color:#fff1d9;text-shadow:0 1px 4px #001725}
.fruit-caption>span:first-child{padding-right:8px}
.fruit-caption>span:last-child{flex-shrink:0}
.site{transition:filter .5s,opacity .5s}
.viewing-work .site{filter:blur(9px);opacity:.5}
.work-dialog[open]{animation:reveal-ui .35s ease both}
.work-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:17px;font-size:15px;color:var(--muted)}
.close-work{background:transparent;display:flex;align-items:center;gap:16px;font-size:16px;padding:8px 0 8px 15px;color:var(--ink)}
.close-work span{font-size:28px;line-height:20px}
.media-stage{aspect-ratio:16/9;max-height:62svh;overflow:hidden;display:flex;justify-content:center;align-items:center;border:1px solid #e7eaff69;background:#0731b9;position:relative}
.work-media{display:block;width:100%;height:100%;object-fit:contain;border:0;background:#020f3c}
.media-stage:has(img.work-media){aspect-ratio:auto;height:auto;max-height:none;background:transparent;border:0}
img.work-media{width:auto;max-width:100%;height:auto;max-height:65svh;object-fit:contain;background:transparent}
.additional-artwork{display:block;width:auto;max-width:100%;height:auto;max-height:65svh;margin:28px auto 0;object-fit:contain}
.large-study{width:100%;height:100%;padding:9% 23%;position:relative;background-image:linear-gradient(#052bb696,#052bb696),url('/assets/bg-only-deer.png');background-size:cover;background-position:right top}
.large-study .study-art{width:100%;height:100%}
.large-study>span{position:absolute;bottom:19px;left:24px;color:var(--muted);font-style:italic;font-size:14px}
.work-details{display:flex;justify-content:space-between;align-items:flex-start;gap:30px;margin-top:24px;padding-bottom:8px}
.work-kind{font-size:14px;font-style:italic;color:var(--muted)}
.work-details h2{font-size:38px;font-weight:400;letter-spacing:-.5px;margin:9px 0 6px;line-height:1.1}
.work-details p{margin:0;font-size:16px;color:var(--muted);line-height:1.6}
.work-paging{display:flex;align-items:center;gap:19px;margin-top:20px;white-space:nowrap;font-size:14px}
.work-paging button{font-size:25px;background:none;padding:10px;color:var(--ink)}
.work-paging button:hover,.close-work:hover{color:white}
.media-error{text-align:center;font-size:20px;line-height:1.7}
.journal.story-page{max-width:760px;width:100%;margin:0 auto;padding:65px 28px 100px}
.back-to-garden{display:inline-block;font-size:15px;color:var(--muted)}
.back-to-garden span{margin-right:10px}
.studio-story{padding-top:44px}
.journal .studio-story h1{font-size:42px;font-weight:400;letter-spacing:-1px;line-height:1.15;margin:0 0 38px;outline:none}
.story-text{font-size:21px;line-height:1.72}
.story-text p{margin:0 0 1.35em;orphans:3;widows:3}
.story-text p:last-child{margin-bottom:0}
.story-credits{margin-top:54px}
.credit-group+.credit-group{margin-top:44px}
.credit-group h2{margin:0 0 23px;font-size:15px;font-weight:400;color:var(--muted)}
.credit-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:32px 25px}
.credit-logo{margin:0;display:flex;align-items:center;justify-content:center;min-width:0;height:118px}
.credit-logo img{display:block;width:auto;height:auto;max-width:100%;max-height:118px;object-fit:contain}
.support-logos{display:block}
.support-logos .credit-logo{justify-content:flex-start;height:auto}
.support-logos img{width:330px;max-height:none}
.media-logos .credit-logo{height:98px}
.media-logos img{max-height:98px}
@media(max-width:700px){
 .credit-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px}
 .credit-logo,.credit-logo img{max-height:110px}
 .support-logos .credit-logo{max-height:none}
 .support-logos img{max-height:none}
}
.journal-open .site-footer{display:none}
@media(max-width:700px){
 .mobile-branches{display:block}
 .intro .deer-link{animation-duration:4.6s}
 .work-dialog{max-height:94svh}
 .work-toolbar{font-size:13px;gap:12px}
 .media-stage{aspect-ratio:16/9;max-height:50svh}
 .large-study{padding:16% 16%}
 .large-study>span{font-size:13px;left:15px;bottom:13px}
 .work-details{display:block;margin-top:20px}
 .work-details h2{font-size:32px}
 .work-details p{font-size:16px;max-width:320px}
 .work-paging{justify-content:space-between;margin-top:20px}
 .journal.story-page{padding:40px 26px 68px}
 .studio-story{padding-top:36px}
 .journal .studio-story h1{font-size:34px;margin-bottom:30px}
 .story-text{font-size:19px;line-height:1.7}
}
@media(prefers-reduced-motion:reduce){
 *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .prelude .site-header,.prelude .site-footer,.prelude .fruit,.prelude .branches,.prelude .mobile-branches,.prelude .deer-caption{opacity:1;visibility:visible}
 .prelude .deer-link{transform:none;opacity:1}
 .totems{display:none}
}

.totems{mask-image:linear-gradient(to right,transparent 34%,#000 37%),linear-gradient(to bottom,#000 37%,transparent 41%);mask-composite:add}
@media(min-width:1001px){.scene{width:min(100%,calc((100svh - 104px) * 1.655));min-height:560px}}
@media(max-width:700px){.totems{mask-image:linear-gradient(to right,transparent 35%,#000 42%);object-fit:fill}}
@media(min-width:701px){.deer-link{left:4.6%;width:22.6%}}
.media-stage{width:100%}.large-study{background-size:300% auto;background-position:right top}
@font-face{font-family:'Studio Garamond';src:local('Baskerville-Italic');font-style:italic;font-display:swap}
@media(max-width:700px){.fruit:nth-child(3){--mobile-y:35%}}
.totems{filter:none}
@keyframes totems-appear{0%{opacity:0;filter:blur(9px);transform:scale(1.015)}28%{opacity:.75;filter:blur(0)}52%{opacity:.65;filter:blur(.2px)}100%{opacity:0;filter:blur(17px);transform:scale(1.045)}}
.deer{overflow:hidden}


.site-footer{justify-content:center}
.branch .antler-symbol{font-family:'Courier New',monospace;font-size:var(--glyph-size);font-weight:600;fill:var(--glyph-color);opacity:var(--glyph-opacity)}
@media(max-width:700px){.intro .fruit{animation-delay:var(--fruit-delay-mobile)}}

/* A small, quiet replay mark. Its accessible name remains available. */
.site-footer #replay{display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:50%;transition:color .3s}
.site-footer #replay span{margin:0;font-size:26px;line-height:1;display:block;transition:transform .7s ease}
.site-footer #replay:hover{color:var(--ink)}
.site-footer #replay:hover span{transform:rotate(-35deg)}

/* Scattered circles catch a little of the deer's color, away from the trunk. */
.antler-mote{opacity:var(--mote-opacity);pointer-events:none}
.mote-drift{animation:mote-breathe var(--mote-period) var(--mote-phase) ease-in-out infinite alternate}
.mote-halo{fill:var(--mote-color);opacity:.23;filter:blur(1.8px)}
.mote-core{fill:var(--mote-color)}
.mote-core.mote-outline{fill:none;stroke:var(--mote-color);stroke-width:.8}
.branch .mote-ring{font-family:'Courier New',monospace;font-weight:400;font-size:12px;fill:var(--mote-color);opacity:.9}
.intro .antler-mote{animation:mote-arrives 2.1s calc(6.4s + var(--grow-delay)) ease-out both}
.intro .branch .mote-ring{animation:none}
@keyframes mote-arrives{from{opacity:0}to{opacity:var(--mote-opacity)}}
@keyframes mote-breathe{from{transform:translate(0,2px);opacity:.55}to{transform:translate(var(--mote-dx),-4px);opacity:1}}
@media(max-width:700px){.branch .mote-ring{font-size:10px}}
@media(prefers-reduced-motion:reduce){.mote-drift{animation:none;transform:none;opacity:.75}}

/* Motion is composited from decoded artwork and two drawing layers. */
html{scrollbar-gutter:stable}
.blue-ground .ground-image{display:block;width:100%;height:100%;object-fit:cover}
.study-art{object-fit:contain}
.antler-canvas,.light-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.prelude .antler-canvas,.prelude .light-canvas{visibility:hidden}
.totems{opacity:0;filter:none;transform:none;contain:layout paint}
.totems img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:fill}
.totem-sharp,.totem-soft{opacity:0}
.intro .totems{animation:none;opacity:1;filter:none;transform:none}
.intro .totem-sharp{animation:totem-sharp-pass 6.5s 2.5s ease-in-out both}
.intro .totem-soft{animation:totem-soft-pass 6.5s 2.5s ease-in-out both}
@keyframes totem-sharp-pass{0%{opacity:0}28%,45%{opacity:.73}78%,100%{opacity:0}}
@keyframes totem-soft-pass{0%,40%{opacity:0}65%{opacity:.46}100%{opacity:0}}
.intro .deer-link{animation:deer-glides 5.8s cubic-bezier(.22,.55,.27,1) both}
.intro .deer{animation:none}
@keyframes deer-glides{from{transform:translate3d(-145%,16px,0);opacity:0}12%{opacity:1}to{transform:translate3d(0,0,0);opacity:1}}
.deer-link:hover .deer{filter:none;transform:none}
.intro .fruit{animation-name:fruit-dissolves;animation-timing-function:cubic-bezier(.25,.1,.25,1)}
@keyframes fruit-dissolves{from{opacity:0}to{opacity:1}}
.fruit{transition:transform .65s cubic-bezier(.2,.65,.3,1)}
button.fruit:hover{transform:rotate(var(--tilt)) translate3d(0,-3px,0)}
.site{transition:none}
.viewing-work .site{filter:none;opacity:1}
.work-dialog::backdrop{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:backdrop-enters .35s ease both}
.work-dialog[open]{animation:dialog-enters .35s cubic-bezier(.2,.65,.3,1) both}
.work-dialog.is-closing{animation:dialog-leaves .24s ease both}
.work-dialog.is-closing::backdrop{animation:backdrop-leaves .24s ease both}
@keyframes backdrop-enters{from{opacity:0}to{opacity:1}}
@keyframes backdrop-leaves{from{opacity:1}to{opacity:0}}
@keyframes dialog-enters{from{opacity:0;transform:translate3d(0,7px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes dialog-leaves{from{opacity:1;transform:translate3d(0,0,0)}to{opacity:0;transform:translate3d(0,4px,0)}}
@media(max-width:700px){button.fruit:hover{transform:rotate(calc(var(--tilt) * .65)) translate3d(0,-3px,0)}}
