:root{color-scheme:light;font-family:Segoe UI,Comic Sans MS,cursive,sans-serif;line-height:1.5;--pink-100: #fff0f6;--pink-200: #fcc2d7;--pink-300: #faa2c1;--pink-400: #f06595;--pink-500: #e64980;--purple-100: #f3d9fa;--purple-200: #e599f7;--purple-300: #cc5de8;--purple-400: #be4bdb;--gold: #ffd43b;--gold-dark: #f59f00;--lavender: #e8d5f5;--mint: #c3fae8;--peach: #ffe8cc;--shadow-pink: rgba(230, 73, 128, .2);--shadow-purple: rgba(190, 75, 219, .2)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:linear-gradient(135deg,var(--pink-100) 0%,#fce4ec 25%,var(--lavender) 50%,#e8eaf6 75%,var(--mint) 100%);background-attachment:fixed;color:#4a154b}body{overflow-x:hidden}.app-container{min-height:100vh;position:relative;overflow:hidden}.app-container:before,.app-container:after{content:"";position:fixed;border-radius:50%;opacity:.15;pointer-events:none;z-index:0}.app-container:before{width:400px;height:400px;background:radial-gradient(circle,var(--pink-300),transparent);top:-100px;right:-100px;animation:float 8s ease-in-out infinite}.app-container:after{width:300px;height:300px;background:radial-gradient(circle,var(--purple-200),transparent);bottom:-80px;left:-80px;animation:float 10s ease-in-out infinite reverse}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-30px) rotate(5deg)}}@keyframes sparkle{0%,to{opacity:0;transform:scale(0) rotate(0)}50%{opacity:1;transform:scale(1) rotate(180deg)}}@keyframes bounce-in{0%{transform:scale(0) rotate(-10deg);opacity:0}50%{transform:scale(1.1) rotate(3deg)}70%{transform:scale(.95) rotate(-1deg)}to{transform:scale(1) rotate(0);opacity:1}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}@keyframes confetti-fall{0%{transform:translateY(-100vh) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}@keyframes rainbow{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}@keyframes card-matched{0%{transform:scale(1)}30%{transform:scale(1.15) rotate(-3deg)}60%{transform:scale(1.1) rotate(3deg)}to{transform:scale(1.05) rotate(0)}}.game-header{text-align:center;padding:2rem 1rem 1rem;position:relative;z-index:1}.game-title{font-size:2.5rem;font-weight:800;background:linear-gradient(135deg,var(--pink-500),var(--purple-400),var(--pink-400));background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:shimmer 3s linear infinite;text-shadow:none;margin-bottom:.25rem;letter-spacing:-.02em}.game-subtitle{font-size:1rem;color:var(--pink-400);font-weight:500;opacity:.8}.stats-bar{display:flex;justify-content:center;gap:1.5rem;padding:1rem;flex-wrap:wrap;position:relative;z-index:1}.stat-item{display:flex;align-items:center;gap:.5rem;background:#ffffffd9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:.6rem 1.2rem;border-radius:2rem;border:2px solid var(--pink-200);box-shadow:0 4px 15px var(--shadow-pink);font-weight:600;font-size:.95rem;transition:transform .2s ease}.stat-item:hover{transform:translateY(-2px)}.stat-icon{font-size:1.2rem}.stat-value{color:var(--pink-500);font-weight:700;min-width:1.5rem;text-align:center}.difficulty-selector{display:flex;justify-content:center;gap:.75rem;padding:.5rem 1rem 1rem;position:relative;z-index:1}.difficulty-btn{padding:.5rem 1.25rem;border:2px solid var(--pink-200);border-radius:2rem;background:#fffc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--pink-500);font-weight:600;font-size:.85rem;cursor:pointer;transition:all .3s ease;font-family:inherit}.difficulty-btn:hover{transform:translateY(-2px);box-shadow:0 4px 15px var(--shadow-pink)}.difficulty-btn.active{background:linear-gradient(135deg,var(--pink-400),var(--purple-400));color:#fff;border-color:transparent;box-shadow:0 4px 20px var(--shadow-purple)}.game-board{display:grid;gap:.75rem;padding:1rem 1.5rem 2rem;max-width:600px;margin:0 auto;position:relative;z-index:1}.game-board.easy{grid-template-columns:repeat(4,1fr);max-width:400px}.game-board.medium{grid-template-columns:repeat(4,1fr);max-width:450px}.game-board.hard{grid-template-columns:repeat(6,1fr);max-width:600px}.card-wrapper{perspective:800px;aspect-ratio:1;cursor:pointer}.card{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.4,0,.2,1);border-radius:1rem}.card.flipped{transform:rotateY(180deg)}.card.matched{animation:card-matched .6s ease forwards}.card-face{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;border-radius:1rem;backface-visibility:hidden;font-size:2.2rem;border:3px solid transparent;transition:all .3s ease}.card-back{background:linear-gradient(135deg,var(--pink-200),var(--purple-200));border-color:var(--pink-300);box-shadow:0 4px 15px var(--shadow-pink),inset 0 0 30px #ffffff4d}.card-back:after{content:"";font-size:1.8rem;filter:drop-shadow(0 2px 4px rgba(230,73,128,.3))}.card-front{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-color:var(--pink-200);transform:rotateY(180deg);box-shadow:0 4px 15px var(--shadow-pink)}.card.matched .card-front{background:linear-gradient(135deg,var(--pink-100),var(--purple-100));border-color:var(--gold);box-shadow:0 0 20px #ffd43b66,0 4px 15px var(--shadow-pink)}.card-wrapper:not(.flipped):not(.matched):hover .card{transform:rotateY(15deg) scale(1.05)}.card-wrapper:not(.flipped):not(.matched):hover .card-back{box-shadow:0 8px 25px var(--shadow-purple),inset 0 0 30px #fff6}.btn-row{display:flex;justify-content:center;gap:1rem;padding:0 1rem 2rem;position:relative;z-index:1}.btn{padding:.75rem 2rem;border:none;border-radius:2rem;font-weight:700;font-size:1rem;cursor:pointer;transition:all .3s ease;font-family:inherit;display:flex;align-items:center;gap:.5rem}.btn-primary{background:linear-gradient(135deg,var(--pink-400),var(--purple-400));color:#fff;box-shadow:0 4px 20px var(--shadow-purple)}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 30px var(--shadow-purple)}.btn-secondary{background:#ffffffd9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--pink-500);border:2px solid var(--pink-200)}.btn-secondary:hover{transform:translateY(-3px);box-shadow:0 8px 25px var(--shadow-pink)}.win-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#fff0f6e6;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);display:flex;align-items:center;justify-content:center;z-index:100;animation:bounce-in .6s ease}.win-card{text-align:center;padding:3rem 2.5rem;background:#fff;border-radius:2rem;box-shadow:0 20px 60px var(--shadow-purple),0 0 0 3px var(--pink-200);max-width:400px;width:90%;position:relative;overflow:hidden}.win-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--pink-400),var(--purple-400),var(--gold),var(--pink-400));background-size:200% auto;animation:shimmer 2s linear infinite}.win-emoji{font-size:4rem;margin-bottom:1rem;display:inline-block;animation:pulse 1.5s ease infinite}.win-title{font-size:2rem;font-weight:800;background:linear-gradient(135deg,var(--pink-500),var(--purple-400));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.win-subtitle{color:var(--pink-400);font-size:1rem;margin-bottom:1.5rem}.win-stats{display:flex;justify-content:center;gap:2rem;margin-bottom:2rem}.win-stat{text-align:center}.win-stat-value{font-size:1.8rem;font-weight:800;color:var(--purple-400)}.win-stat-label{font-size:.8rem;color:var(--pink-300);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.confetti-piece{position:fixed;width:10px;height:10px;top:-10px;z-index:101;animation:confetti-fall linear forwards;border-radius:2px}.stars{display:flex;justify-content:center;gap:.25rem;margin-bottom:1.5rem}.star{font-size:2rem;animation:bounce-in .4s ease backwards}.star:nth-child(1){animation-delay:.1s}.star:nth-child(2){animation-delay:.2s}.star:nth-child(3){animation-delay:.3s}.star.empty{opacity:.3;filter:grayscale(1)}@media(max-width:500px){.game-title{font-size:1.8rem}.stats-bar{gap:.75rem}.stat-item{padding:.4rem .8rem;font-size:.85rem}.game-board{gap:.5rem;padding:.75rem 1rem 2rem}.card-face{font-size:1.5rem;border-radius:.75rem}.difficulty-selector{gap:.5rem}.difficulty-btn{padding:.4rem 1rem;font-size:.8rem}}
