*{margin:0;box-sizing:border-box}body{background-color:#111315;margin:0;min-width:320px;min-height:100vh;font-family:DM Sans,serif}#root{display:flex;flex-direction:column;align-items:center}.cover{width:100%}.list{border-radius:7px;max-width:85%;background-color:#1b1d1f;display:flex;flex-direction:column;align-items:center;transform:translateY(-15%);padding:1rem}.info{text-align:center;background-image:url("data:image/svg+xml,%3csvg%20width='257'%20height='153'%20viewBox='0%200%20257%20153'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M2%2071.8885C3.45531%2057.3142%2023.696%2041.7169%2033.6244%2033.2805C66.0308%205.74397%20114.381%20-4.23546%20155.905%205.8326C246.941%2027.9052%20154.103%20161.746%2080.308%20136.587C52.5484%20127.123%2076.0283%2089.2122%2086.9341%2076.2621C113.937%2044.1978%20164.916%2027.0297%20204.998%2044.5915C239.889%2059.8782%20266.993%20108.858%20249.574%20146.239C247.754%20150.145%20240.823%20152.29%20236.924%20150.16C231.733%20147.325%20239.159%20139.456%20240.538%20137.04'%20stroke='%23302522'%20stroke-width='3'%20stroke-linecap='round'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right}.info>h1{margin:2rem 1.5rem 1.5rem;color:#fef7ee;font-size:2rem}.info>p{font-size:1rem;color:#6f757c}.buttons{margin:1rem;display:flex;gap:1rem}.buttons button{font-size:1rem;color:#fef7ee;background:none;border:none;border-radius:7px;padding:.7rem;cursor:pointer;margin:1rem}#all{background-color:#4d5562}.buttons button:focus{background-color:#4d5562}.coffes{justify-content:center;display:flex;flex-wrap:wrap;gap:5rem}.pop{position:absolute;top:5px;left:5px;text-align:center;border-radius:8px;width:28%;font-size:1rem;background-color:#f6c768}.card{position:relative}.card>img{border-radius:10px}.cardName{display:flex;align-items:center;justify-content:space-between;margin:.75rem 0}.cardName>p{color:#fef7ee;font-size:1.25rem}.cardName>span{border-radius:5px;padding:.25rem .5rem;font-weight:800;background-color:#bee3cc}.star{display:flex;align-items:center;gap:.25rem;color:#fef7ee}.votes{color:#6f757c}.rate{display:flex;align-items:center;justify-content:space-between;color:#ed735d}@media (max-width:650px){.list{transform:translateY(-2%)}}