:root{--card-width:65px;--card-height:90px;--card-margin:5px;--slot-card-width:60px;--slot-card-height:85px;--border-radius-sm:4px;--border-radius-md:8px;--shadow-color:rgba(0,0,0,0.15);--shadow-hover-color:rgba(0,0,0,0.25);--primary-color:#61dafb;--secondary-color:#282c34;--background-light:#f7f9fa;--background-medium:#e9ecef;--text-color-dark:#212529;--text-color-light:#f8f9fa}.game-container{display:flex;flex-direction:column;align-items:center;padding:15px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:var(--background-light);height:100vh;overflow-y:auto;box-sizing:border-box;color:var(--text-color-dark)}.game-title{font-size:2em;color:var(--secondary-color);margin-bottom:5px;font-weight:400}.score-display{font-size:1.3em;color:var(--primary-color);margin-bottom:12px;font-weight:500}.message-display{font-size:1.15em;margin-bottom:18px;font-weight:700;padding:8px 12px;border-radius:var(--border-radius-sm)}.message-display[style*="color: green"]{background-color:#d4edda;color:#155724!important;border:1px solid #c3e6cb}.message-display[style*="color: red"]{background-color:#f8d7da;color:#721c24!important;border:1px solid #f5c6cb}.restart-button{padding:12px 25px;font-size:1.05em;color:var(--text-color-light);background-color:var(--primary-color);border:none;border-radius:var(--border-radius-md);cursor:pointer;transition:background-color .25s ease,transform .15s ease;margin-top:25px;font-weight:500;box-shadow:0 2px 4px var(--shadow-color)}.restart-button:hover{background-color:#3ab0d8;transform:translateY(-2px);box-shadow:0 4px 8px var(--shadow-hover-color)}.game-board-container{margin-bottom:15px;padding:15px;background-color:var(--background-medium);border-radius:var(--border-radius-md);box-shadow:0 4px 12px var(--shadow-color)}.game-board{position:relative;width:380px;height:340px;border:1px solid #ced4da;border-radius:var(--border-radius-sm);background-image:linear-gradient(to bottom right,#e9ecef,#dee2e6)}.game-card-responsive{position:relative;width:var(--card-width);height:var(--card-height);margin:var(--card-margin);border:1px solid #adb5bd;background-color:#fff;display:flex;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 2px 5px var(--shadow-color);border-radius:var(--border-radius-md);font-size:1.8em;user-select:none;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out,border-color .2s ease;font-weight:700;color:var(--secondary-color);transform-style:preserve-3d}.game-card-responsive:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;border-radius:var(--border-radius-md);box-shadow:1px 1px 0 rgba(0,0,0,.05),2px 2px 0 rgba(0,0,0,.05),3px 3px 0 rgba(0,0,0,.05);z-index:-1;transition:transform .2s ease-in-out;background-color:inherit;opacity:.7}.game-card-responsive.face-down{background-color:#cccccc;color:#555555;background-image:repeating-linear-gradient(45deg,rgba(0,0,0,.08),rgba(0,0,0,.08) 8px,transparent 0,transparent 16px)}.game-card-responsive:hover{transform:translateY(-5px) scale(1.05) rotateX(5deg);box-shadow:0 8px 15px var(--shadow-hover-color);border-color:var(--primary-color)}.game-card-responsive:hover:before{transform:translateZ(-2px)}.game-card-responsive.is-disabled{cursor:not-allowed;box-shadow:0 2px 4px rgba(0,0,0,.2)}.game-card-responsive.is-disabled:hover{transform:none;box-shadow:0 2px 4px rgba(0,0,0,.2)}.game-card-responsive.is-disabled:before{opacity:.5}.card-type-display{display:flex;justify-content:center;align-items:center;width:100%;height:100%;font-size:var(--card-font-size,24px);font-weight:700;color:var(--card-text-color,#333);transition:clip-path .3s ease-out}@media (max-width:768px){:root{--card-width:55px;--card-height:75px;--card-margin:4px;--slot-card-width:50px;--slot-card-height:70px}.game-title{font-size:2em}.score-display{font-size:1.1em}.message-display{font-size:1em;margin-bottom:15px}.game-board-container{padding:10px;margin-bottom:10px}.game-board{width:300px;height:280px}.restart-button{padding:10px 20px;font-size:.95em;margin-top:20px}.slot-area-title{font-size:1.2em;margin-top:15px;margin-bottom:8px}.slot-container{padding:8px;margin-bottom:15px}.elimination-slot{padding:10px}.empty-slot-placeholder{width:var(--slot-card-width);height:var(--slot-card-height);margin:var(--card-margin)}}@media (max-width:480px){:root{--card-width:45px;--card-height:60px;--card-margin:3px;--slot-card-width:40px;--slot-card-height:55px}.game-title{font-size:1.8em}.score-display{font-size:1em}.message-display{font-size:.9em;padding:6px 10px}.game-board{width:250px;height:230px}.restart-button{font-size:.9em}}.card-type-display svg{width:70%;height:70%;object-fit:contain}.slot-area-title{font-size:1.4em;color:var(--secondary-color);margin-top:5px;margin-bottom:5px;font-weight:500}.slot-container{background-color:#d1d9e0;border-radius:var(--border-radius-md);margin-bottom:15px;min-height:calc(var(--slot-card-height) + 24px);padding:12px 12px 20px;box-shadow:inset 0 2px 4px rgba(0,0,0,.1)}.elimination-slot,.slot-container{display:flex;justify-content:center;align-items:center}.elimination-slot{flex-wrap:nowrap;gap:var(--card-margin);padding:12px;border-radius:var(--border-radius-sm);min-width:calc(7 * (var(--slot-card-width) + var(--card-margin)) + var(--card-margin));overflow-x:hidden;background-color:#c0c9d2}.elimination-slot .game-card-responsive{width:var(--slot-card-width);height:var(--slot-card-height);box-shadow:0 1px 3px var(--shadow-color);font-size:1.5em}.elimination-slot .game-card-responsive:hover{transform:translateY(-2px);box-shadow:0 3px 6px var(--shadow-hover-color)}.empty-slot-placeholder{width:var(--slot-card-width);height:var(--slot-card-height);background-color:rgba(255,255,255,.3);border:2px dashed #a0a9b0;border-radius:var(--border-radius-md);display:flex;justify-content:center;align-items:center;color:#78828a;font-size:2em}.empty-slot-placeholder:before{content:"+";opacity:.5}@media (max-width:600px){:root{--card-width:50px;--card-height:70px;--card-margin:4px;--slot-card-width:45px;--slot-card-height:65px}.game-title{font-size:1.8em}.message-display,.score-display{font-size:1.05em}.restart-button{padding:10px 20px;font-size:.95em}.game-board{width:90vw;min-height:280px}.elimination-slot{min-width:calc(7 * (var(--slot-card-width) + var(--card-margin)) + var(--card-margin) - 10px);padding:8px;gap:3px}.game-card-responsive{font-size:1.5em}.elimination-slot .game-card-responsive{font-size:1.3em}.empty-slot-placeholder{font-size:1.5em}}@media (min-width:601px) and (max-width:1024px){:root{--card-width:60px;--card-height:85px;--slot-card-width:55px;--slot-card-height:75px}.game-board{width:450px;height:400px}.game-card-responsive{font-size:1.7em}.elimination-slot .game-card-responsive{font-size:1.4em}}@media (min-width:1025px){.game-board{width:500px;height:420px}}@keyframes card-enter-slot{0%{transform:scale(.5) translateY(-50px);opacity:.5}to{transform:scale(1) translateY(0);opacity:1}}.card-entering-slot-animation{animation:card-enter-slot .3s ease-out}@keyframes card-eliminate{0%{transform:scale(1) rotate(0deg);opacity:1}50%{transform:scale(1.2) rotate(15deg);opacity:.7}to{transform:scale(.1) rotate(-30deg);opacity:0;visibility:hidden}}.card-eliminate-animation{animation:card-eliminate .5s ease-in-out forwards}@keyframes card-matched-pop{0%{transform:scale(1)}50%{transform:scale(1.15)}to{transform:scale(1)}}.card-matched-animation{animation:card-matched-pop .3s ease-in-out}@keyframes card-flip-up{0%{transform:rotateY(90deg) scaleX(.8);opacity:.8}to{transform:rotateY(0deg) scaleX(1);opacity:1}}.card-flip-up-animation{animation:card-flip-up .4s ease-out;backface-visibility:hidden}.card-interactive:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 4px 8px rgba(0,0,0,.2)}