:root{--bg:#f5f6fa;--card-back:#4834d4;--card-front:#fff;--primary:#686de0;--accent:#eb4d4b;--text:#2f3640;--glass:#fffc;--shadow:0 10px 30px #0000001a}body{background-color:var(--bg);color:var(--text);justify-content:center;align-items:center;height:100vh;margin:0;padding:0;font-family:Inter,Nunito,sans-serif;display:flex;overflow:hidden}#app{box-sizing:border-box;flex-direction:column;gap:20px;width:100%;max-width:600px;padding:20px;display:flex}.header{background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow);border:1px solid #ffffff80;border-radius:20px;justify-content:space-between;align-items:center;padding:15px 25px;display:flex}.btn-back{color:var(--text);background:#0000000d;border-radius:10px;padding:8px 15px;font-size:.9rem;font-weight:700;text-decoration:none;transition:background .3s}.btn-back:hover{background:#0000001a}.stats{color:var(--card-back);gap:15px;font-weight:900;display:flex}.board{aspect-ratio:1;perspective:1000px;gap:12px;width:100%;display:grid}.card{cursor:pointer;width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.175,.885,.32,1.275);position:relative}.card.flipped{transform:rotateY(180deg)}.card-face{backface-visibility:hidden;border-radius:12px;justify-content:center;align-items:center;width:100%;height:100%;font-size:2.5rem;display:flex;position:absolute;box-shadow:0 4px 15px #0000001a}.card-back{background-color:var(--card-back);color:#fff;background-image:radial-gradient(circle,#ffffff1a 10%,#0000 10.5%);background-size:10px 10px}.card-front{background-color:var(--card-front);border:2px solid var(--primary);transform:rotateY(180deg)}.card.matched{cursor:default;animation:.6s ease-in-out pulse}@keyframes pulse{0%{transform:rotateY(180deg)scale(1)}50%{box-shadow:0 0 20px var(--primary);transform:rotateY(180deg)scale(1.1)}to{transform:rotateY(180deg)scale(1)}}.overlay{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:100;opacity:0;pointer-events:none;background:#0009;justify-content:center;align-items:center;transition:opacity .5s;display:flex;position:fixed;inset:0}.overlay.visible{opacity:1;pointer-events:auto}.modal{text-align:center;box-shadow:var(--shadow);background:#fff;border-radius:30px;padding:40px;transition:transform .5s cubic-bezier(.175,.885,.32,1.275);transform:translateY(20px)}.overlay.visible .modal{transform:translateY(0)}.modal h2{color:var(--primary);margin:0 0 10px;font-size:2.5rem}.main-btn{background-color:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:15px;margin-top:20px;padding:15px 40px;font-size:1.2rem;font-weight:900;transition:transform .2s,box-shadow .2s;box-shadow:0 10px 20px #686de04d}.main-btn:hover{transform:translateY(-3px);box-shadow:0 15px 25px #686de066}.hidden{display:none!important}