.a24mcw-wall{
    --a24mcw-gap-x:56px;
    --a24mcw-gap-y:42px;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:var(--a24mcw-gap-y) var(--a24mcw-gap-x);
    align-items:start;
    justify-items:center;
    align-content:start;
    width:100vw;
    max-width:none;
    min-height:100svh;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    padding:12px 20px 32px;
    box-sizing:border-box;
    overflow:hidden;
}
.a24mcw-cover,
.a24mcw-cover:visited{
    --a24mcw-mobile-x:0px;
    --a24mcw-mobile-y:0px;
    --a24mcw-mobile-rot:0deg;
    width:min(100%,280px);
    display:block;
    text-decoration:none;
    color:inherit;
    position:relative;
    transform:translateY(var(--a24mcw-offset)) rotate(var(--a24mcw-rot));
    transition:transform .24s ease, box-shadow .24s ease, filter .24s ease;
    filter:drop-shadow(0 10px 20px rgba(0,0,0,.12));
    z-index:1;
}
.a24mcw-cover-inner{
    display:block;
    overflow:hidden;
    border-radius:2px;
    background:#fff;
    box-shadow:0 4px 10px rgba(0,0,0,.10);
}
.a24mcw-cover img{
    display:block;
    width:100%;
    aspect-ratio:4 / 5;
    object-fit:cover;
}
.a24mcw-cover:hover,
.a24mcw-cover:focus-visible{
    transform:translateY(calc(var(--a24mcw-offset) - 16px)) scale(1.045) rotate(calc(var(--a24mcw-rot) * .55));
    filter:drop-shadow(0 20px 34px rgba(0,0,0,.22));
    z-index:20;
}
.a24mcw-cover:focus-visible{outline:2px solid rgba(0,0,0,.2);outline-offset:8px}

@media(max-width:980px){
    .a24mcw-wall{
        --a24mcw-gap-x:28px;
        --a24mcw-gap-y:28px;
        grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
        min-height:100svh;
        padding:10px 14px 24px;
    }
    .a24mcw-cover,.a24mcw-cover:visited{width:min(100%,230px)}
}

@media(max-width:640px){
    .a24mcw-wall{
        grid-template-columns:repeat(2,minmax(0,1fr));
        --a24mcw-gap-x:8px;
        --a24mcw-gap-y:8px;
        min-height:100svh;
        padding:8px 8px 18px;
        overflow:hidden;
        align-items:start;
        align-content:start;
    }
    .a24mcw-cover,
    .a24mcw-cover:visited{
        width:min(100%,42vw);
        filter:drop-shadow(0 8px 14px rgba(0,0,0,.11));
        transform:translate(var(--a24mcw-mobile-x), var(--a24mcw-mobile-y)) rotate(var(--a24mcw-mobile-rot));
    }
    .a24mcw-cover:hover,
    .a24mcw-cover:focus-visible{
        transform:translate(var(--a24mcw-mobile-x), calc(var(--a24mcw-mobile-y) - 10px)) scale(1.03) rotate(var(--a24mcw-mobile-rot));
        filter:drop-shadow(0 16px 24px rgba(0,0,0,.18));
    }

    .a24mcw-cover:nth-child(4n+1){
        justify-self:start;
        --a24mcw-mobile-x:-10px;
        --a24mcw-mobile-y:6px;
        --a24mcw-mobile-rot:-16deg;
    }
    .a24mcw-cover:nth-child(4n+2){
        justify-self:end;
        --a24mcw-mobile-x:8px;
        --a24mcw-mobile-y:-42px;
        --a24mcw-mobile-rot:11deg;
    }
    .a24mcw-cover:nth-child(4n+3){
        justify-self:start;
        --a24mcw-mobile-x:2px;
        --a24mcw-mobile-y:-10px;
        --a24mcw-mobile-rot:7deg;
    }
    .a24mcw-cover:nth-child(4n+4){
        justify-self:end;
        --a24mcw-mobile-x:-8px;
        --a24mcw-mobile-y:-30px;
        --a24mcw-mobile-rot:-3deg;
    }
}

@media(max-width:420px){
    .a24mcw-wall{
        --a24mcw-gap-x:4px;
        --a24mcw-gap-y:6px;
        min-height:100svh;
        padding:6px 6px 14px;
    }
    .a24mcw-cover,
    .a24mcw-cover:visited{width:min(100%,43vw)}
    .a24mcw-cover:nth-child(4n+1){--a24mcw-mobile-x:-6px;--a24mcw-mobile-y:8px;--a24mcw-mobile-rot:-15deg}
    .a24mcw-cover:nth-child(4n+2){--a24mcw-mobile-x:5px;--a24mcw-mobile-y:-30px;--a24mcw-mobile-rot:10deg}
    .a24mcw-cover:nth-child(4n+3){--a24mcw-mobile-x:0px;--a24mcw-mobile-y:-4px;--a24mcw-mobile-rot:6deg}
    .a24mcw-cover:nth-child(4n+4){--a24mcw-mobile-x:-4px;--a24mcw-mobile-y:-20px;--a24mcw-mobile-rot:-2deg}
}
