/* Small responses, composed with the existing scene and scroll transforms. */
.site-header nav{position:relative}
.nav-ink{position:absolute;height:1px;left:0;bottom:-11px;width:var(--nav-width,0px);translate:var(--nav-left,0px) 0;background:#71845c;opacity:var(--nav-visible,0);transition:translate .42s cubic-bezier(.2,.8,.2,1),width .42s cubic-bezier(.2,.8,.2,1),opacity .2s;pointer-events:none}
.nav-ink:after{content:"";position:absolute;right:-2px;top:-1px;width:3px;height:3px;background:#82996b;border-radius:50%}
.site-header nav a[aria-current="location"]{color:#566c46}
.site-header .brand>img{transform-origin:50% 75%;transition:rotate .45s cubic-bezier(.2,.8,.2,1)}
.site-header .brand:hover>img,.site-header .brand:focus-visible>img{rotate:-9deg}
.magnetic-link{translate:calc(var(--mag-x,0)*1px) calc(var(--mag-y,0)*1px);transition:translate .25s cubic-bezier(.2,.8,.2,1),color .25s,border-color .25s}
.magnetic-link:active{scale:.975}.magnetic-link:focus-visible{translate:none}
.text-link,.social-link{position:relative}
.text-link:after,.social-link:after{content:"";position:absolute;bottom:-1px;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.text-link:hover:after,.social-link:hover:after,.text-link:focus-visible:after,.social-link:focus-visible:after{transform:scaleX(1);transform-origin:left}
.work-copy h3{position:relative;width:fit-content;overflow:visible}
.title-letter{display:inline-block;transform-origin:50% 85%;white-space:pre}
.work-copy h3:after{content:"";position:absolute;bottom:-13px;left:3px;width:38px;height:1px;background:#95a780;transform:scaleX(var(--title-interest,0));transform-origin:left;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.work-row:hover .work-copy h3,.work-row:focus-within .work-copy h3{--title-interest:1}
.work-row .demo{--look-x:0;--look-y:0;--light-x:50%;--light-y:50%}
.world-scene{translate:calc(var(--look-x)*8px) calc(var(--look-y)*5px);transition:translate .65s cubic-bezier(.2,.8,.2,1)}
.world-halo{background:radial-gradient(circle at var(--light-x) var(--light-y),#f0ddaa24,transparent 62%);transition:box-shadow .7s}
.demo-furry:hover .world-halo{box-shadow:0 0 50px -25px #d1c99860}
.term-window,.cost-dashboard{translate:calc(var(--look-x)*5px) calc(var(--look-y)*4px);rotate:y calc(var(--look-x)*4deg);transition:translate .5s cubic-bezier(.2,.8,.2,1),rotate .6s cubic-bezier(.2,.8,.2,1)}
.term-window:after{content:"";position:absolute;inset:-80%;pointer-events:none;background:linear-gradient(115deg,transparent 43%,#d8ecc90b 48%,#e8f4dc17 50%,transparent 56%);translate:-75% 0;opacity:0}
.term-window.signal-pass:after{animation:terminal-glint 1.65s ease-out both}
@keyframes terminal-glint{12%{opacity:1}85%{opacity:1}100%{translate:55% 0;opacity:0}}
.cost-dashboard:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--light-x) var(--light-y),#fffdf099,transparent 70%);mix-blend-mode:soft-light}
.receipt:after{content:"＋ ¥32";position:absolute;right:14px;top:0;font:italic 17px LocalSerif,Georgia,serif;color:#738960;opacity:0;pointer-events:none}
.receipt.added:after{animation:amount-stamp 1.3s ease-out both}
@keyframes amount-stamp{15%{opacity:.95;translate:0 -8px}55%{opacity:.9}100%{opacity:0;translate:0 -40px}}
.paste-playground{translate:calc(var(--look-x)*5px) calc(var(--look-y)*3px);transition:translate .6s cubic-bezier(.2,.8,.2,1)}
.paste-fan button{transition:transform .6s,background .4s,border-color .4s,box-shadow .4s,scale .3s}.paste-fan button:hover,.paste-fan button:focus-visible{scale:1.035}.paste-fan button:active{scale:.985}
.sodu-cell.peer:not(.selected):not(.filled){background:#e9eddf}.sodu-cell.peer:not(.selected){box-shadow:inset 0 0 0 .5px #a5b28c44}.sodu-cell:focus-visible{z-index:4}
.social-emblem .emblem-orbit{transition:rotate 1s cubic-bezier(.2,.8,.2,1),border-color .6s}.social-node:hover .emblem-orbit,.social-node:focus-within .emblem-orbit{rotate:28deg}
.social-node .emblem-satellite{transition:scale .5s,background .5s}.social-node:hover .emblem-satellite,.social-node:focus-within .emblem-satellite{scale:1.3;background:var(--platform-accent)}
.chapter-copy h2:after{content:"";display:block;width:38px;height:1px;margin-top:15px;background:#93a67c;transform:scaleX(.25);transform-origin:left;opacity:.45;transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .7s}
.story-stage[data-docked] .chapter-copy h2:after{transform:scaleX(1.35);opacity:1}
.about-hello{justify-self:center;text-align:center}.about-hello .about-symbol{background:transparent;color:var(--ink);margin:0 auto;transition:border-color .4s,background .4s;overflow:visible;padding:0}
.about-hello .about-symbol:hover,.about-hello .about-symbol:focus-visible{background:#ffffff30;border-color:#97ab7970}.hello-invitation{display:block;font-size:8px;color:#939c85;letter-spacing:.04em;margin-top:36px}
.hello-ripple{position:absolute;inset:-3px;border:1px solid #9cae845e;border-radius:50%;opacity:0;pointer-events:none}.hello-spark{position:absolute;right:-19px;top:1px;font-size:26px;line-height:1;color:#9eae86;opacity:0;pointer-events:none}
.about-greeting{font:italic 13px/1.8 LocalSerif,"Songti SC",serif;color:#748663;min-height:24px;margin-top:16px}
dialog[open]{animation:dialog-arrive .3s cubic-bezier(.2,.8,.2,1)}dialog[open]::backdrop{animation:backdrop-arrive .3s ease-out}
@keyframes dialog-arrive{from{opacity:0;translate:0 12px;scale:.985}to{opacity:1;translate:0 0;scale:1}}@keyframes backdrop-arrive{from{opacity:0}to{opacity:1}}
.dialog-close{transition:rotate .35s,background .35s;border-radius:50%}.dialog-close:hover{rotate:90deg;background:#c7d1b827}
@media(max-width:700px){.nav-ink{bottom:-9px}.about-hello{justify-self:start}.about-hello .about-symbol{margin-left:10px}.hello-invitation{font-size:8px;margin-top:25px}.chapter-copy h2:after{margin-top:9px;width:26px}.about-greeting{font-size:12px}.hello-spark{font-size:21px;right:-11px}}
@media(hover:none){.magnetic-link{translate:none}.magnetic-link:active{scale:.97}.world-scene,.term-window,.cost-dashboard,.paste-playground{translate:none;rotate:none}.work-copy h3:after{transform:scaleX(.7)}}
@media(prefers-reduced-motion:reduce){.magnetic-link,.world-scene,.term-window,.cost-dashboard,.paste-playground{translate:none!important;rotate:none!important;scale:none!important}.title-letter{transform:none!important;opacity:1!important}.nav-ink,.social-emblem .emblem-orbit,.site-header .brand>img,.dialog-close{transition:none!important;rotate:none!important}.hello-spark,.hello-ripple,.receipt:after,.term-window:after{display:none!important}}
.motion-paused .magnetic-link,.motion-paused .world-scene,.motion-paused .term-window,.motion-paused .cost-dashboard,.motion-paused .paste-playground{translate:none!important;rotate:none!important;scale:none!important}
.motion-paused .title-letter{transform:none!important;opacity:1!important}.motion-paused .nav-ink,.motion-paused .social-emblem .emblem-orbit,.motion-paused .site-header .brand>img,.motion-paused .dialog-close{transition:none!important;rotate:none!important}
.motion-paused .hello-spark,.motion-paused .hello-ripple,.motion-paused .receipt:after,.motion-paused .term-window:after{display:none!important}.motion-paused dialog[open],.motion-paused dialog[open]::backdrop{animation:none!important}
@media(prefers-reduced-motion:reduce){.paste-fan button{scale:1!important}}.motion-paused .paste-fan button{scale:1!important}
