*{box-sizing:border-box;margin:0;padding:0}:root{--background-color:#1f2d1f;--background-color-dark:#151f15;--card-color:#2a3d2a;--accent-color:#5dba5a60;--text-color:#e8f5e8}h1,p{color:var(--text-color)}h1{letter-spacing:.3rem;margin-bottom:1rem}html{background-color:var(--background-color)}.game-window{flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:2rem;display:flex}.scores{background-color:var(--background-color-dark);border:3px solid var(--accent-color);border-radius:1rem;flex-direction:column;align-items:center;gap:1rem;margin-top:1rem;padding:2rem 3rem;display:flex}.game-window div p{font-size:2rem}.game-window button{background-color:var(--card-color);border:1px solid var(--accent-color);width:14rem;height:3rem;color:var(--text-color);border-radius:.4rem;margin-top:1rem;font-size:1.3rem}.game-window button:hover{background-color:#3a533a}.card-field{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(4,1fr);gap:2rem;display:grid}.card{width:200px;height:200px;box-shadow:3px 3px var(--accent-color);background-color:var(--card-color);border-radius:1rem;justify-content:center;align-items:center;animation-fill-mode:forwards;display:flex;position:relative}.card:hover{background-color:#334733}.card p{opacity:.7;cursor:default;font-size:2rem;position:absolute;bottom:.2rem}.clicked{animation-name:click;animation-duration:.6s}.card img{width:200px;height:200px}@keyframes click{0%{box-shadow:3px 3px var(--accent-color);background-color:#1b271b}30%{box-shadow:1px 1px var(--accent-color)}}
