.memory-page { max-width:780px; }
.memory-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; }
#memory-status { min-height:3.2em; font-weight:700; color:var(--plum); }
.memory-board { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.7rem; margin:1rem 0; }
.memory-card { min-width:0; aspect-ratio:1; border:2px solid #967493; border-radius:1rem; background:var(--plum); color:white; cursor:pointer; display:grid; place-items:center; padding:.5rem; }
.memory-back { font-size:2.5rem; }
.memory-card.revealed { background:#fff; color:var(--plum); }
.memory-card.matched { background:#e7f7ef; border:3px solid #327354; }
.memory-front svg { width:48px; height:48px; fill:#853b78; display:block; margin:auto; }
.unicorn-face { display:block; font-size:2.5rem; line-height:1.25; }
.memory-name { display:block; font-size:.8rem; font-weight:700; margin-top:.25rem; }
.memory-card:focus-visible { outline:4px solid #1479a0; outline-offset:3px; }
.memory-card[aria-disabled="true"] { cursor:default; }
@media(max-width:460px) { .memory-board { grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; } .memory-card { border-radius:.6rem; } }

.memory-level { margin:1rem 0; }
.memory-level label { font-weight:700; display:block; margin-bottom:.4rem; }
.memory-level select { padding:.75rem; border:1px solid #967493; border-radius:.5rem; font:inherit; background:white; max-width:100%; }
.memory-board.memory-easy { grid-template-columns:repeat(3,minmax(0,1fr)); max-width:520px; }
.memory-win { background:#e7f7ef; border:2px solid #327354; border-radius:1rem; padding:1.25rem; margin:1.2rem 0; }
.memory-win h3 { margin-top:0; }
.memory-win a { display:inline-block; margin:.7rem; }