*{box-sizing:border-box}body{font-family:system-ui,sans-serif}:root{--bg-dark: #0f172a;--bg-darker: #020617;--primary: #3b82f6;--primary-glow: rgba(59, 130, 246, .5);--success: #10b981;--success-glow: rgba(16, 185, 129, .5);--warning: #f59e0b;--danger: #ef4444;--text-light: #f8fafc;--text-muted: #94a3b8;--card-back-bg: linear-gradient(135deg, #1e293b, #0f172a);--card-front-bg: linear-gradient(135deg, #1e293b, #334155);--glass-bg: rgba(15, 23, 42, .75);--glass-border: rgba(255, 255, 255, .08)}.card-grid{display:grid;flex:0 0 auto;width:var(--memory-board-width, 232px);height:var(--memory-board-height, 232px);max-width:none;max-height:none;gap:10px;justify-content:center;align-content:center;transform:scale(var(--memory-board-scale, 1));transform-origin:center}.card{display:block;margin:0;padding:0;border:0;background:transparent;color:inherit;font:inherit;perspective:600px;cursor:pointer;width:112px;height:112px;aspect-ratio:1 / 1;position:relative;user-select:none}.card:focus-visible{outline:4px solid #fff36a;outline-offset:2px;border-radius:14px}.card:disabled{cursor:default}.card-inner{width:100%;height:100%;transition:transform .4s cubic-bezier(.3,.8,.4,1.1);transform-style:preserve-3d;-webkit-transform-style:preserve-3d;will-change:transform;position:relative;border-radius:12px}.card.flipped .card-inner{transform:rotateY(180deg);-webkit-transform:rotateY(180deg)}.card.matched .card-inner{transform:rotateY(180deg) scale(.95);-webkit-transform:rotateY(180deg) scale(.95);pointer-events:none}.card-front,.card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:all .2s ease}.card-back{background:var(--card-back-bg);border:2px solid rgba(59,130,246,.35);box-shadow:inset 0 0 15px #3b82f626}.card:active:not(.flipped):not(.matched) .card-back{border-color:var(--primary);transform:scale(.95)}.card-back img{width:50%;height:50%;filter:drop-shadow(0 0 4px var(--primary-glow));pointer-events:none}.card-front{background:var(--card-front-bg);border:2px solid rgba(255,255,255,.15);transform:rotateY(180deg);padding:8px}.card-front img{width:80%;height:80%;object-fit:contain;pointer-events:none}.card.matched .card-front{border-color:var(--success);box-shadow:0 0 12px var(--success-glow)}.feedback{padding:14px 16px;text-align:center;border-top:1px solid var(--glass-border);background:#0f172a4d;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:70px}#feedbackText{font-size:13px;font-weight:500;color:var(--text-muted)}.combo-badge{font-size:11px;font-weight:800;background:linear-gradient(135deg,var(--warning),#ea580c);color:#fff;padding:2px 8px;border-radius:10px;margin-top:6px;box-shadow:0 2px 6px #f59e0b4d;animation:popIn .3s cubic-bezier(.18,.89,.32,1.28)}.hidden{display:none!important}@keyframes popIn{0%{transform:scale(.5);opacity:0}70%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){#cardGrid :is(.card-inner,.card-front,.card-back),.combo-badge,.star-rating .star{animation:none!important;transition:none!important}}
