/* Subtle interface motion; artwork and media remain untouched. */
:root{--motion-ease:cubic-bezier(.22,.61,.36,1)}
@keyframes page-enter{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
#content.motion-enter{animation:page-enter .38s var(--motion-ease) both}
.motion-reveal{opacity:0;transform:translateY(14px);transition:opacity .55s var(--motion-ease),transform .55s var(--motion-ease);transition-delay:var(--reveal-delay,0ms)}
.motion-reveal.is-visible{opacity:1;transform:none}
.menu button,.secondary button,.crumb button,.contact-links a,.external-links a,.br-footer a{transition:color .18s ease}
.tile .image img{transition:transform .65s var(--motion-ease)}
.tile .caption>span{display:inline-block;transition:transform .25s var(--motion-ease),color .2s ease}
.music-listen{transition:background .2s ease,color .2s ease,border-color .2s ease}
@media(hover:hover) and (pointer:fine){.tile:hover .image img{transform:scale(1.025)}.tile:hover .caption>span{transform:translate(2px,-2px);color:#222}.menu .subcategory:hover{color:#222}.youtube-watch:hover img{transform:scale(1.015)}}
.youtube-watch img{transition:opacity .25s ease,transform .5s var(--motion-ease)}
.portfolio-disclosure svg{transition:transform .22s var(--motion-ease)}
@media(max-width:700px){.motion-reveal{transform:translateY(9px);transition-duration:.4s}#content.motion-enter{animation-duration:.28s}}
@media(prefers-reduced-motion:reduce){#content.motion-enter{animation:none}.motion-reveal{opacity:1;transform:none;transition:none}.tile .image img,.tile .caption>span,.youtube-watch img,.portfolio-disclosure svg{transition:none}.tile:hover .image img,.tile:hover .caption>span,.youtube-watch:hover img{transform:none}}