.memory-game,.memory-game *{box-sizing:border-box;margin:0;padding:0}.memory-game{background:transparent;margin:0 auto;max-width:1200px;position:relative;width:100%}.memory-game .stats{align-items:flex-start;color:inherit;display:flex;font-size:16px;gap:24px;justify-content:center;margin:0 auto 24px;padding:12px 24px;text-shadow:none;width:fit-content}.memory-game .stat-item{align-items:center;display:flex;flex-direction:column;text-shadow:none}.memory-game .stat-label{font-size:12px;line-height:1.6;opacity:.8;text-shadow:none}.memory-game .stat-value{font-size:24px;font-variant-numeric:tabular-nums;font-weight:700;height:32px;line-height:32px;text-shadow:none}.memory-game #timer{text-align:center;width:80px}.memory-game .action-btn{align-items:center;background:transparent;border:none;color:inherit;cursor:pointer;display:flex;flex-direction:column;font:inherit;padding:0;text-shadow:none;transition:transform .4s ease,opacity .4s ease}.memory-game .action-btn .action-icon{fill:currentColor;height:32px;transition:transform .4s ease;width:24px}.memory-game .action-btn .stat-label{line-height:1.6}.memory-game .action-btn:hover{opacity:.8}.memory-game .action-btn.disabled{cursor:default;opacity:.4;pointer-events:none}.memory-game .action-btn:hover .action-icon{transform:scale(1.2)}.memory-game .action-btn.reset-btn:hover .action-icon{transform:rotate(90deg) scale(1.2)}.memory-game .action-btn.reset-btn:active .action-icon{transform:rotate(180deg) scale(1.2)}.memory-game .game-container{align-items:start;display:grid;gap:16px;justify-content:center;width:100%}.memory-game .card{aspect-ratio:1;border-radius:12px;cursor:pointer;position:relative;transform-origin:center center;transform-style:preserve-3d;transition:transform .4s ease;width:100%}.memory-game .card:hover:not(.flipped){transform:scale(1.08)}.memory-game .card.flipped{transform:rotateY(180deg)}.memory-game .card.flipped:hover{transform:rotateY(180deg) scale(1.08)}.memory-game .card.matched{animation:matchPulse .4s ease-out;cursor:default;transform:rotateY(180deg)}@keyframes matchPulse{0%{transform:rotateY(180deg) scale(1)}50%{transform:rotateY(180deg) scale(1.08)}to{transform:rotateY(180deg) scale(1)}}.memory-game .card.matched:hover{transform:rotateY(180deg)}.memory-game .card.hide-duplicate{opacity:0;pointer-events:none;transform:rotateY(180deg) scale(.8);transition:opacity .5s ease,transform .5s ease}.memory-game .card.fade-in{animation:cardFadeIn .4s ease forwards}@keyframes cardFadeIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.memory-game .card.flipped.wrong{animation:shake .4s cubic-bezier(.36,.08,.24,.96)}.memory-game .card-face{backface-visibility:hidden;border-radius:12px;flex-direction:column;height:100%;overflow:hidden;position:absolute;width:100%}.memory-game .card-back,.memory-game .card-face{align-items:center;display:flex;justify-content:center}.memory-game .card-back{background:#fff}.memory-game .card-front{transform:rotateY(180deg)}.memory-game .card-front img{height:100%;object-fit:cover;width:100%}.memory-game .card-gradient{bottom:0;height:40%;left:0;pointer-events:none;position:absolute;right:0;z-index:1}.memory-game .card-badge{border-radius:48px;font-size:10px;font-weight:700;left:10px;letter-spacing:.8px;line-height:1;padding:5px 8px 4px;position:absolute;text-transform:uppercase;top:12px;z-index:2}.memory-game .card-info{bottom:12px;color:#fff;left:12px;position:absolute;right:20px;text-shadow:none;z-index:2}.memory-game .card-name{color:#fff;font-size:16px;font-weight:500;line-height:1.2}.memory-game .card-position{color:#fff;font-size:12px;font-weight:300;line-height:1.2;margin:0}@keyframes shake{0%,to{transform:translateX(0) rotateY(180deg)}10%,90%{transform:translateX(-4px) rotateY(180deg)}20%,80%{transform:translateX(4px) rotateY(180deg)}30%,50%,70%{transform:translateX(-8px) rotateY(180deg)}40%,60%{transform:translateX(8px) rotateY(180deg)}}@media (max-width:768px){.memory-game{padding:0 16px}.memory-game .stats{flex-wrap:wrap;font-size:16px;gap:16px;padding:8px 16px}.memory-game .stat-label{font-size:12px}.memory-game .stat-value{font-size:16px;height:24px;line-height:24px}.memory-game #timer{width:56px}.memory-game .action-btn .action-icon{height:24px;width:20px}.memory-game .game-container{gap:8px}.memory-game .card{border-radius:12px}.memory-game .card:hover:not(.flipped){transform:none}.memory-game .card.flipped:hover{transform:rotateY(180deg)}.memory-game .card-badge{font-size:8px;left:6px;padding:5px 8px 4px;top:8px}.memory-game .card-info{bottom:8px;left:8px;right:8px}.memory-game .card-name{font-size:14px}.memory-game .card-position{font-size:10px}}