.logo-tile {
    border-radius: 0.75rem;
    padding: 1rem;
    display: grid;
    place-items: center;
    background-color: var(--surface-raised);

    img {
        inline-size: 100%;
        aspect-ratio: 1;
        object-fit: contain;
    }

    &:is(a) {
        position: relative;

        &::after {
            position: absolute;
            opacity: 0;
            inset: 0;
            display: grid;
            place-items: center;
            background: color-mix(in oklab, var(--surface-raised) 50%, transparent);
            backdrop-filter: blur(3px);
            font-weight: 700;
            color: var(--text-on-field);
            content: attr(data-name);
            transition: opacity var(--transition-duration) var(--transition-timing);
        }

        &:hover::after, &:focus-visible::after { opacity: 1 }
    }
}