footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    height: var(--size-footer); 
    background-color: var(--color-black);
    border-top: 2px solid var(--color-purple);
    position: fixed;
    bottom: 0;
    padding: 0 var(--size-edge);
}
footer span {
    font-family: var(--font-pixel);
    color: rgba(255, 255, 255, 0.7);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#nav-switch {
    display: flex;
    gap: 10px;
}
#nav-switch .icon-btn {
    background-color: var(--color-black);
    color: var(--color-yellow);
    border: 2px solid var(--color-yellow);
}
#nav-switch .icon-btn:hover {
    background-color: var(--color-yellow);
    color: var(--color-black);
}
#nav-switch .icon-btn .icon * {
    fill: var(--color-yellow);
}
#nav-switch .icon-btn:hover .icon * {
    fill: var(--color-black);
}
#previous-btn .icon {
    transform: rotate(180deg);
}