:root{--primary-color: #f6f1de;--secondary-color: #3e3f5b;--tertiary-color: #acd3a8;--quaternary-color: #0c0950}body{background-color:var(--tertiary-color);margin:0}.App{display:flex;flex-direction:column;height:100vh}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:1rem;padding:1rem;flex:1}h1,h2{text-align:center}.score{width:fit-content;position:sticky;top:0;background-color:var(--secondary-color);color:var(--primary-color);opacity:.8;padding:1rem;border-bottom-right-radius:1rem;border-bottom-left-radius:1rem}footer{height:2rem;display:flex;justify-content:center;align-items:center;gap:.5rem;background-color:var(--secondary-color);color:var(--primary-color)}a{color:var(--tertiary-color)}.card{background-color:var(--secondary-color);color:var(--primary-color);border-radius:1rem;text-align:center;display:flex;flex-direction:column;justify-content:space-between}.card:hover{box-shadow:0 0 20px var(--quaternary-color);cursor:pointer}.card img{width:100%;height:auto;border-top-left-radius:1rem;border-top-right-radius:1rem}