/* Timing and entrance patterns carried over from Frisk's shared motion.css. */
:root{--motion-ease:cubic-bezier(.16,1,.3,1);--motion-quick:180ms;--motion-normal:280ms}
html{scroll-behavior:smooth;scroll-padding-top:110px}
:where(button,a,input,summary){-webkit-tap-highlight-color:transparent}
button,a{transition:background-color var(--motion-quick) ease,border-color var(--motion-quick) ease,color var(--motion-quick) ease,box-shadow var(--motion-normal) ease,translate var(--motion-normal) var(--motion-ease),scale var(--motion-normal) var(--motion-ease),opacity var(--motion-quick) ease}
button:active:not(:disabled){scale:.975}
input{transition:border-color var(--motion-quick) ease,background-color var(--motion-quick) ease,box-shadow var(--motion-normal) ease}
:where(button,a,input):focus-visible{outline:2px solid #bc2d42;outline-offset:4px}
header{animation:surface-enter 620ms var(--motion-ease) both}
.intro>.sigil{animation:surface-enter 620ms 55ms var(--motion-ease) both}
.intro>h1{animation:surface-enter 620ms 110ms var(--motion-ease) both}
.intro>p{animation:surface-enter 620ms 165ms var(--motion-ease) both}
.details{animation:surface-enter 620ms 220ms var(--motion-ease) both}
.panel{animation:surface-enter 620ms 165ms var(--motion-ease) backwards}
footer{animation:surface-enter 620ms 275ms var(--motion-ease) both}
@keyframes surface-enter{from{opacity:0;translate:0 12px;scale:.985}to{opacity:1;translate:0 0;scale:1}}
@keyframes panel-enter{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
@media(hover:hover) and (pointer:fine){button:hover:not(:disabled){translate:0 -2px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}button:is(:hover,:active),a:is(:hover,:active){translate:none!important;scale:1!important}}