@view-transition{navigation:auto}
::view-transition-old(root){animation:gyeol-fade-out 100ms ease-out both}
::view-transition-new(root){animation:gyeol-fade-in 200ms ease-out both}
@keyframes gyeol-fade-out{to{opacity:0}}
@keyframes gyeol-fade-in{from{opacity:0}to{opacity:1}}
@keyframes gyeol-dialog-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes gyeol-backdrop-in{from{opacity:0}to{opacity:1}}
dialog[open]{animation:gyeol-dialog-in 200ms cubic-bezier(.2,.7,.2,1)}
dialog[open]::backdrop{animation:gyeol-backdrop-in 160ms ease-out}
.primary,.secondary,a.button{transition:background-color 160ms ease,border-color 160ms ease,box-shadow 160ms ease,transform 140ms ease}
@media(hover:hover){.primary:not(:disabled):hover,.secondary:not(:disabled):hover,a.button:hover{transform:translateY(-1px)}}
.primary:not(:disabled):active,.secondary:not(:disabled):active,a.button:active{transform:scale(.985)}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root),dialog[open],dialog[open]::backdrop{animation:none!important}.primary,.secondary,a.button{transition:none!important;transform:none!important}}