@import"https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap";*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;font-family:roboto,sans-serif;--primary-color: #00A9A5;--secondary-color: #DC143C}#root{width:100%;min-height:100vh;display:grid;grid-template-rows:min-content min-content 1fr min-content}.rules{justify-self:center;margin-top:2rem;padding:0 1rem;font-weight:700;max-width:40ch;color:var(--secondary-color)}footer{background-color:var(--primary-color);color:#fff;display:flex;justify-content:center;padding:1rem 0}header{display:flex;justify-content:space-evenly;align-items:center;flex-wrap:wrap;row-gap:1rem;background-color:var(--primary-color);padding:1rem}header p{background-color:var(--secondary-color);font-size:1.4rem;font-family:Playfair Display,sans-serif;font-weight:700;letter-spacing:.06rem;color:#fff;padding:.7rem;box-shadow:0 0 10px 5px gray;text-align:center}header nav{display:flex;gap:1rem}nav button{cursor:pointer;background-color:var(--secondary-color);border:2px solid var(--secondary-color);font-size:1.1rem;color:#fff;padding:.4rem .5rem;transform:perspective(100px);will-change:transform;transition:transform .1s ease-in-out}nav button:hover{transform:perspective(100px) translateZ(5px);box-shadow:0 0 10px 2px gray}@media only screen and (width <= 600px){header p{box-shadow:none;width:100%}header{padding:0 0 1rem}}.board{max-width:100%;padding:3rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-auto-rows:min-content;justify-items:center;gap:2rem .2rem;justify-self:center;align-self:center}.card img{width:100%}.card{cursor:pointer;width:280px;min-height:162.516px;padding:.8rem;background-color:var(--primary-color);box-shadow:0 0 10px gray;will-change:transform;transition:transform .2s ease-in-out}.card:hover{transform:perspective(100px) translateZ(10px)}.score-tracker{position:fixed;top:100px;right:0;background-color:var(--secondary-color);color:#fff;padding:1rem;z-index:1}@media only screen and (width <= 600px){.score-tracker{padding:.5rem;bottom:0;top:auto}}