*{margin:0;padding:0;box-sizing:border-box}.app{display:flex}.categories{padding:4rem;border-right:1px solid black;height:100vh;justify-content:space-between;overflow-y:auto}.categories li{text-align:center;list-style:none;font-size:1.5rem;padding:1rem;background-color:#eda840;border-radius:.5rem;cursor:pointer}.category-list{display:flex;flex-direction:column;margin-top:3rem;gap:3rem;justify-content:space-evenly}.categories h2{text-align:center;font-size:2rem}.container{text-align:center;position:absolute;top:50%;left:58%;transform:translate(-50%,-50%);display:flex;gap:2rem;flex-direction:column;align-items:center}.matches{display:flex;gap:2rem}.options{display:flex}.first,.second{display:flex;flex-direction:column;gap:2rem;justify-content:space-between}.first-span,.second-span{font-size:1.5rem}span.score{position:relative;font-size:1.7rem}.result{top:45%;left:40%;position:absolute;font-size:1.5rem}.firsts,.seconds{padding:1.7rem;font-size:1.5rem;background-color:#d8bfd8;border-radius:8px;cursor:pointer;flex-grow:1}.seconds{background-color:#add8e6}@media screen and (max-width: 420px){.categories{display:none}.matches{padding:1rem;margin-right:4rem}.container{text-align:center;scale:.9}.score{margin-top:1rem;margin-right:3.2rem}.result{position:relative;top:24rem;left:3.5rem;font-size:.9rem}}