.memory-main{max-width:760px;margin:auto;padding:18px 16px 40px}.memory-main nav{display:flex;justify-content:space-between;gap:16px}.memory-main header h1{font-size:clamp(1.65rem,5vw,2.5rem);letter-spacing:-.04em;margin:20px 0 6px;text-transform:none}.memory-main header>p{margin:0 0 20px;color:#525b70}.memory-game{padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow-lg)}.memory-controls{display:flex;align-items:end;gap:12px}.memory-controls label{display:grid;gap:5px;flex:1;font-size:.8rem;font-weight:700}.memory-controls select,.memory-controls button,.memory-completion button{font:inherit;min-height:44px;border-radius:10px;padding:10px;border:1px solid #a7b8d4;background:#f4f7fd;color:var(--ink);max-width:100%}.memory-controls button,.memory-completion button{background:#365cb5;color:white;border-color:#365cb5;font-weight:700;cursor:pointer}.memory-stats{display:grid;grid-template-columns:1fr 1fr 1fr 1.8fr;gap:8px;margin:18px 0 10px;font-size:.75rem;color:#525b70}.memory-stats strong{display:block;font-size:1.15rem;color:var(--ink);font-variant-numeric:tabular-nums}.memory-stats .best-stat strong{font-size:.86rem;padding-top:4px}.board-hint,.settings-note{font-size:.8rem;color:#525b70}.memory-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.memory-card{position:relative;aspect-ratio:1.15;border:2px solid transparent;background:#e7edf9;border-radius:14px;padding:0;cursor:pointer;perspective:600px;min-width:0;min-height:60px;color:#213257;touch-action:manipulation}.memory-card span.card-back,.memory-card span.card-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;transition:transform .23s;border-radius:11px}.card-back{background:repeating-linear-gradient(45deg,#4267bc,#4267bc 9px,#3b60b4 9px,#3b60b4 11px);color:#fff;font-size:2rem;font-weight:800}.card-face{background:#fff;transform:rotateY(-180deg);flex-direction:column;overflow:hidden}.card-face img{width:72%;height:72%;object-fit:contain;pointer-events:none}.card-face>span{font-size:clamp(.5rem,1.8vw,.75rem);line-height:1.2;max-width:100%;overflow-wrap:anywhere;padding:0 2px}.card-face.letter{font-size:clamp(2rem,7vw,4.3rem);font-weight:800;color:#334d97}.revealed .card-back{transform:rotateY(180deg)}.revealed .card-face{transform:rotateY(0)}.memory-card.matched{border-color:#24804d;background:#edfff1;cursor:default}.matched .card-face{background:#edfff1}.matched:after{content:'✓';position:absolute;top:3px;right:5px;font-size:1rem;color:#17613a;font-weight:900}.memory-card:focus-visible,.memory-main select:focus-visible,.memory-main button:focus-visible{outline:3px solid #cf5e13;outline-offset:3px}.memory-completion{margin-top:16px;padding:16px;background:#e9f8ee;border-radius:14px}.memory-completion[hidden]{display:none}.memory-completion h2{margin:0}.memory-copy{line-height:1.7;padding:12px 4px}.memory-copy h2{font-size:1.3rem;margin-top:28px}.memory-copy li{margin:8px 0}.memory-copy a,.memory-main nav a{color:#294f9f}.settings-note{margin-bottom:0}@media(min-width:600px){.memory-board[data-difficulty=hard]{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:420px){.memory-main{padding:12px 10px}.memory-game{padding:12px}.memory-controls{gap:6px}.memory-controls select{font-size:.8rem;padding:8px 3px}.memory-controls button{font-size:.8rem;padding:8px}.memory-board{gap:6px}.memory-card{border-radius:10px}.memory-stats{grid-template-columns:repeat(3,1fr)}.best-stat{grid-column:1/-1;display:flex;gap:8px;align-items:center}.memory-stats .best-stat strong{padding:0}.memory-main header h1{margin-top:16px}}@media(prefers-reduced-motion:reduce){.memory-card span.card-back,.memory-card span.card-face{transition:none}}
.memory-page #site-footer{position:static;padding:0 16px 24px;line-height:2}.memory-page #site-footer a{display:inline-block}

/* A bright playroom palette; every card back stays identical. */
.memory-page {
  background:
    radial-gradient(circle at 9% 12%, #ffe58b 0, #ffe58b 5%, transparent 22%),
    radial-gradient(circle at 94% 35%, #c8a9ff 0, transparent 28%),
    radial-gradient(circle at 8% 75%, #8fe9df 0, transparent 27%),
    linear-gradient(145deg, #fff6d9, #fff0f7 48%, #eae3ff);
  background-attachment: fixed;
}
.memory-main header h1 { color: #5d269b; }
.memory-main header > p { color: #714775; }
.memory-game { border: 2px solid #fff; background: #fffdf9; box-shadow: 0 10px 0 #d9c5ee, 0 18px 35px #652d9720; }
.memory-controls label { color: #642c88; }
.memory-controls select { background: #f3e8ff; border: 2px solid #cfa8ed; color: #4c256c; }
.memory-controls button, .memory-completion button { background: #c33371; border: 2px solid #a5245c; box-shadow: 0 3px 0 #912051; color: #fff; }
.memory-controls button:hover, .memory-completion button:hover { background: #ad245f; }
.memory-stats { gap: 6px; }
.memory-stats > div { border-radius: 12px; padding: 8px; color: #4e3568; background: #f0e2ff; }
.memory-stats > div:nth-child(2) { background: #c9f4e9; color: #205c51; }
.memory-stats > div:nth-child(3) { background: #ffedaa; color: #74500e; }
.memory-stats > div:nth-child(4) { background: #ffe0ec; color: #843458; }
.memory-stats strong { color: inherit; }
.memory-card { background: #6831a5; box-shadow: 0 4px 0 #632596; }
.card-back {
  background:
    radial-gradient(circle at 18% 22%, #ffffff35 0 5%, transparent 5.5%),
    radial-gradient(circle at 80% 78%, #ffffff30 0 8%, transparent 8.5%),
    linear-gradient(140deg, #b24ee0, #7b39c8 58%, #6031ad);
  border: 2px solid #ffffff45;
  font-size: clamp(2rem, 6vw, 3.3rem);
  text-shadow: 0 3px 0 #54268c;
  color: #fff2b0;
}
.card-face { background: #fff5d7; color: #493064; }
.card-face.letter { color: #b32668; background: #fff0b9; }
.memory-card.matched { border-color: #16916c; background: #c5f6d8; box-shadow: 0 4px 0 #15805f; }
.matched .card-face { background: #d4fbe4; }
.matched:after { color: #07593f; background: #94eab9; border-radius: 50%; width: 20px; height: 20px; text-align: center; line-height: 20px; }
.memory-completion { background: linear-gradient(120deg, #cbf8db, #fff0ad); border: 2px solid #70cba0; color: #265541; }
.memory-copy h2 { color: #642c88; }
.memory-copy a, .memory-main nav a { color: #873274; }
.memory-card:focus-visible, .memory-main select:focus-visible, .memory-main button:focus-visible { outline-color: #193f79; }
@media(max-width:420px) { .memory-stats > div { padding: 6px 8px; } }

/* Celebrations never cover controls or block the next move. */
.memory-board-wrap { position: relative; }
.memory-card.match-pop { animation: memory-pop .55s ease-out; z-index: 1; }
.memory-card.match-pop:before {
  content: ''; position: absolute; z-index: 3; pointer-events: none;
  left: 50%; top: 50%; width: 7px; height: 7px; border-radius: 2px;
  background: #ffc82e;
  box-shadow: -27px -23px #f04495, 28px -26px #ffc82e, -34px 7px #22cdaa, 33px 13px #ae56ea, -16px 30px #ffc82e, 17px 32px #f04495;
  animation: memory-sparkle .65s ease-out forwards;
}
.match-cheer {
  position: absolute; top: -14px; left: 50%; z-index: 4;
  pointer-events: none; white-space: nowrap; opacity: 0;
  background: #fff0a3; color: #653084; border: 2px solid #fff;
  padding: 7px 16px; border-radius: 999px; font-weight: 850;
  box-shadow: 0 4px 14px #68318b25; transform: translate(-50%, 0);
}
.match-cheer.celebrate { animation: memory-cheer 1.15s ease-out forwards; }
@keyframes memory-pop { 0%,100% { transform: scale(1); } 35% { transform: scale(1.09) rotate(-3deg); } 65% { transform: scale(1.03) rotate(2deg); } }
@keyframes memory-sparkle { 0% { transform: scale(.3); opacity: 1; } 65% { opacity: 1; } 100% { transform: scale(1.7) rotate(25deg); opacity: 0; } }
@keyframes memory-cheer { 0% { opacity: 0; transform: translate(-50%, 8px) scale(.8); } 18%,70% { opacity: 1; transform: translate(-50%, -4px) scale(1); } 100% { opacity: 0; transform: translate(-50%, -12px); } }
@media(prefers-reduced-motion:reduce) {
  .memory-card.match-pop { animation: none; }
  .memory-card.match-pop:before { display: none; }
  .match-cheer.celebrate { animation: memory-cheer-still 1.15s linear forwards; }
  @keyframes memory-cheer-still { 0%,85% { opacity: 1; } 100% { opacity: 0; } }
}