.mem{padding-block:var(--space-7) var(--space-9)}.mem-board{gap:var(--space-2);grid-template-columns:repeat(4,minmax(0,1fr));max-width:30rem;display:grid}@media (min-width:64em){.mem-board{gap:var(--space-4);grid-template-columns:repeat(8,minmax(0,1fr));max-width:none}}.mem-card{--lift:0px;aspect-ratio:3/4;border-radius:var(--radius-md);perspective:900px;transform:translateY(var(--lift));transition:transform var(--dur-fast) var(--ease-out);background:0 0;border:0;padding:0;position:relative}.mem-card__inner{transform-style:preserve-3d;transition:transform var(--dur-slow) var(--ease-in-out);position:absolute;inset:0}.mem-card.is-down .mem-card__inner{transform:rotateY(180deg)}.mem-card__face,.mem-card__back{border-radius:var(--radius-md);backface-visibility:hidden;position:absolute;inset:0;overflow:hidden}.mem-card__back{background:var(--color-paper-3);transform:rotateY(180deg)}.mem-card canvas{width:100%;height:100%;image-rendering:pixelated;display:block}.mem-card:focus-visible{outline:2px solid var(--color-ink);outline-offset:3px}@media (hover:hover) and (pointer:fine){.mem-card.is-down:hover{--lift:-6px}}.mem-card.is-matched{cursor:default}.mem-found{align-items:center;gap:var(--space-3) var(--space-5);min-height:3rem;margin-top:var(--space-5);flex-wrap:wrap;display:flex}.mem-found [hidden]{display:none}
