.pagination{--pagination-size:3.5rem;display:flex;align-items:center;justify-content:center;gap:2.5rem}@media(max-width:48em){.pagination{--pagination-size:3rem;gap:2rem}}@media(max-width:30em){.pagination{--pagination-size:2.5rem;gap:.75rem}}.pagination__pages{align-items:center;gap:.5rem}.pagination__pages,.pagination__pages li{display:flex;flex-shrink:0}@media(max-width:30em){.pagination__pages{gap:.375rem}}.pagination__pages--compact{display:none}@media(max-width:48em){.pagination__pages--full{display:none}.pagination__pages--compact{display:flex}}.pagination__arrow,.pagination__box{display:flex;flex:0 0 var(--pagination-size);align-items:center;justify-content:center;width:var(--pagination-size);height:var(--pagination-size);transition:background-color .3s ease,border-color .3s ease,color .3s ease}.pagination__arrow{background:var(--background-light);border:1px solid var(--border-dark)}.pagination__arrow:not(.pagination__arrow--disabled):hover{border-color:var(--accent)}.pagination__arrow:not(.pagination__arrow--disabled):hover svg path{fill:var(--accent);stroke:var(--accent)}.pagination__arrow--disabled{opacity:.4;pointer-events:none}.pagination__box{font-size:1.25rem;font-weight:500;line-height:1.5;text-align:center;text-transform:uppercase}.pagination__page{background:var(--muted-darkest);border:1px solid var(--border-light);color:var(--muted-light)}.pagination__page:not(.pagination__page--active):hover{border-color:var(--border-dark);color:var(--foreground)}.pagination__page--active{background:var(--foreground);border-color:var(--foreground);color:var(--background);pointer-events:none}.pagination__ellipsis{background:var(--muted-darkest);border:1px solid var(--border-light);color:var(--muted-light)}