@property --footer--l1-y {
    initial-value: 0px;
    inherits: true;
    syntax: "<length>";
}

@keyframes footer-ani {
    from {
        --footer--l1-y: -200px;
    }
    to {
        --footer--l1-y: 0px;
    }
}

.footer {
    animation-name: footer-ani;
    animation-fill-mode: both;
    animation-duration: 1ms;
    animation-timeline: view(block 80% 0%);
    animation-timing-function: linear;
}