@layer components{.layout-animations{content-visibility:hidden;display:none}@media (width>=1470px){.layout-animations{content-visibility:auto;justify-content:space-between;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.layout-animations__left,.layout-animations__right{width:calc((100vw - var(--layout-width) - 13px) / 2);opacity:.1;height:100%;transition:opacity .16s var(--transition-easing);justify-content:center;align-items:center;gap:4px;padding:4px;display:flex;position:relative;overflow:clip}.layout-animations__left:hover,.layout-animations__right:hover{opacity:1}.layout-animations__left:after,.layout-animations__right:after{content:"";width:100%;height:100%;box-shadow:inset 0 0 10px 10px var(--grey-100);position:absolute;top:0;left:0}.layout-animations__items{flex-direction:column;flex:0 0 1px;gap:10vh;margin-inline:auto;display:flex}.layout-animations__item{flex:0 0 30vh;width:1px;animation-name:move-to-top;animation-duration:1s;animation-timing-function:linear;animation-timeline:scroll()}.layout-animations__left .layout-animations__item{background-color:var(--blue)}.layout-animations__right .layout-animations__item{background-color:var(--magenta)}.layout-animations__items:nth-child(odd) .layout-animations__item{animation-name:move-to-bottom}@keyframes move-to-top{0%{transform:translateY(0)}to{transform:translateY(-30vh)}}@keyframes move-to-bottom{0%{transform:translateY(0)}to{transform:translateY(30vh)}}.layout-animations__item:nth-child(2n){height:30vh}}}