@keyframes page-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes circuit-shine{0%,100%{box-shadow:0 0 0 0 #c8fa6c00}45%{box-shadow:0 0 22px 3px #c8fa6c55}}
@keyframes success-arrive{from{opacity:.3;transform:translateY(6px)}to{opacity:1;transform:none}}
html{scroll-behavior:smooth;scroll-padding-top:24px}
.site-menu{animation:page-arrive .35s ease-out both}
.studio-intro,.hero,.contact-page,.shell{animation:page-arrive .5s ease-out both}
.studio-games{animation:page-arrive .55s .1s ease-out both}
.site-menu a,.button,.text-link,.featured-game,.featured-art img{transition:color .18s ease,background-color .18s ease,box-shadow .2s ease,transform .2s ease}
.site-menu nav a{position:relative}
.site-menu nav a:after{content:'';position:absolute;left:0;right:0;bottom:3px;height:2px;background:#c8fa6c;transform:scaleX(0);transform-origin:left;transition:transform .18s ease}
.site-menu nav a:hover:after,.site-menu nav a:focus-visible:after{transform:scaleX(1)}
.button:hover{transform:translateY(-2px);box-shadow:0 5px 18px #0004}
.button:active{transform:translateY(0) scale(.98)}
.featured-game:hover{box-shadow:0 10px 30px #0003}
.featured-art a:hover img{transform:scale(1.025)}
.demo-section button{transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease}
.demo-toolbar button:hover,#demo-next:hover{border-color:#c8fa6c}
#demo-board button{transition:background-color .2s ease,border-color .2s ease}
#demo-board svg{transition:transform .24s cubic-bezier(.2,.7,.3,1);transform-origin:center}
#demo-board path,#demo-board circle{transition:stroke .2s ease,fill .2s ease}
#demo-board.complete{animation:circuit-shine .8s ease-out;border-radius:12px}
.demo-success{color:#c8fa6c;animation:success-arrive .3s ease-out}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.button:hover,.button:active,.featured-art a:hover img{transform:none}}