*{box-sizing:border-box}html,body{margin:0;height:100%;overscroll-behavior:none}body{font-family:Georgia,serif;color:#624075;background:#fff8ef url('/assets/memory-match/background.png') center/100% 100% no-repeat}.memory{height:100vh;height:100dvh;max-width:1450px;margin:auto;padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:6px}.back{align-self:flex-start;color:inherit;font-size:clamp(15px,2vw,25px);text-decoration:none;padding:3px}header{text-align:center;flex:none}.book{height:clamp(30px,6vh,60px);width:auto}h1{font-weight:500;font-size:clamp(27px,6.2vh,64px);line-height:1.05;margin:0}header p{font-size:clamp(14px,2.7vh,26px);margin:6px 0}.play{display:flex;align-items:flex-start;justify-content:center;gap:clamp(10px,2vw,24px);width:100%;flex:1;min-height:0;padding:8px 0}.cards{height:100%;aspect-ratio:4/3;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:clamp(7px,1vw,15px);max-width:70%;min-width:0}.card{position:relative;display:block;padding:0;border:2px solid #c6a3b7;border-radius:clamp(12px,1.5vw,22px);background:#c4adce;overflow:hidden;min-width:0;min-height:0;cursor:pointer;touch-action:manipulation;box-shadow:0 2px 4px #a98c9b22;transition:transform .2s,box-shadow .2s}.card:focus-visible,button:focus-visible,.back:focus-visible{outline:3px solid #825695;outline-offset:3px}.card-back,.card-face{position:absolute;inset:0;background-position:center;background-repeat:no-repeat}.card-back{background-image:url('/assets/memory-match/card-back.png');background-size:100% 100%;opacity:1}.card-face{background-image:url('/assets/memory-match/characters.png');background-size:300% 200%;opacity:0}.card.revealed .card-back,.card.matched .card-back{opacity:0}.card.revealed .card-face,.card.matched .card-face{opacity:1}.card.matched{border-color:#e5b24b;box-shadow:0 0 0 2px #f5cf73,0 0 14px #edc55d88;cursor:default}.score{flex-shrink:0;width:clamp(95px,15vw,200px);border:1px solid #d5aeba;border-radius:28px;padding:clamp(10px,2vw,24px) 8px;text-align:center;background:linear-gradient(120deg,#f8d3d3dd,#f9e7e0b0);display:flex;flex-direction:column;align-items:center;gap:6px}.score.purple{background:linear-gradient(120deg,#d6c8e5dd,#ece5f1c0);border-color:#bcabd0}.score.active{box-shadow:0 0 0 3px #dfc891b0,0 0 18px #f3dcae8a}h2{font-size:clamp(17px,2.7vw,32px);margin:5px 0;white-space:nowrap;font-weight:600}.score strong{font-size:clamp(40px,9vh,90px);font-weight:500;color:#a45d79;line-height:1.1}.score.purple strong{color:#7e639b}.score>span{font-size:clamp(16px,2.7vh,28px)}.score .sprig{color:#a38cb3;font-size:clamp(21px,3vw,38px);margin:20px 0 0}.pink .sprig{color:#bf8998}footer{text-align:center;flex:none}#status{font-size:clamp(18px,3vh,30px);margin:1px 0 6px;min-height:1.2em}#restart{font:inherit;font-size:clamp(18px,2.7vh,27px);color:#fffaf4;border:1px solid #ac90c6;border-radius:40px;padding:8px 36px;background:linear-gradient(130deg,#c7b0da,#a98bc6);box-shadow:inset 0 0 12px #e9dbee;cursor:pointer}small{display:block;margin-top:5px;font-size:clamp(12px,1.8vh,18px)}@media(orientation:portrait){.memory{gap:10px}.play{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto minmax(0,1fr);align-items:center;gap:12px;max-width:850px}.cards{grid-column:1/3;grid-row:2;max-width:100%;width:100%;height:auto;max-height:100%;aspect-ratio:4/3;align-self:center}.score{width:100%;flex-direction:row;justify-content:center;gap:15px;padding:8px;border-radius:22px}.score strong{font-size:32px}.score h2{font-size:22px}.score>span{font-size:17px}.score .sprig{display:none}#player-1{grid-column:2;grid-row:1}.book{height:6vh}header{padding-top:5px}h1{font-size:clamp(32px,6vw,55px)}header p{font-size:clamp(14px,2.5vw,24px)}footer{padding-bottom:1vh}}@media(max-width:500px){.memory{padding-left:12px;padding-right:12px}.score{gap:8px}.score h2{font-size:17px}.score strong{font-size:27px}.score>span{font-size:14px}.cards{gap:7px}.card{border-radius:12px}}@media(max-height:480px) and (orientation:landscape){.back{position:absolute;left:14px;top:10px;font-size:15px}.book{display:none}h1{font-size:26px}header p{font-size:14px;margin:3px 0}.memory{gap:2px}.play{padding:3px 0}.score{padding:8px;width:100px}.score h2{font-size:18px}.score strong{font-size:40px}.score .sprig{margin:5px 0}#status{font-size:17px;margin:2px}#restart{font-size:16px;padding:4px 28px}small{display:none}}@media(prefers-reduced-motion:reduce){.card{transition:none}}

.book{width:clamp(200px,26vw,320px);height:clamp(55px,9vh,85px);object-fit:cover;margin:-10px 0 -12px}@media(max-height:480px) and (orientation:landscape){.book{display:none}}