#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}dialog{border:none;border-radius:8px;padding:20px;margin:auto;max-width:430px;box-shadow:0 4px 6px #0000001a}dialog::backdrop{background:#00000080}.wrapper{max-width:436px;margin:0 auto}.about-app{display:flex;flex-direction:column;gap:1rem;align-items:center}.card{padding:2rem;display:flex;flex-direction:column}.todo-label{display:flex;flex-direction:column;gap:1rem}.todo-input{color:#2e5077;padding:.5rem;font-size:16px}.enough-todos-text{margin-top:1rem;text-wrap:balance}.list-todos{list-style:none;padding:0;display:flex;flex-direction:column;gap:1rem}.todo-item{display:grid;grid-template-columns:3fr 1fr 1fr;gap:.5em;align-items:center;padding:.5em;border:1px solid #e2e8f0;background-color:#772342;border-radius:.25rem;transition:all .5s;box-shadow:2px 2px 3px 2px #0000004d}.todo-item:hover{background-color:#2e5077;border-color:#ffa630}.todo-item button{justify-self:center}.fade-out{animation:fadeOut 1s ease-out 1s forwards}.fade-in{animation:fadeIn 1s ease-in forwards}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (min-width: 768px){#root{min-width:500px}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;background-color:#611c35;box-sizing:border-box;margin:0;padding:0}body{margin:0;display:flex;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1;margin-bottom:1rem}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;color:#fff;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}