*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}:root{--primary: #3f75d3;--light: #fefefe;--light2: #f3f1f4;--gradient: linear-gradient(#47a9ff, #3b82fe)}body{background:var(--gradient);min-height:100vh;padding:3em 0;display:flex;justify-content:center}.container{background-color:var(--light);display:flex;justify-content:center;flex-direction:column;width:clamp(320px,100vw,450px);padding-bottom:2em;border-radius:6px}.container__dashboard{display:flex;flex-direction:column;padding:2em 2em 0}.container__dashboard button.--disabled{background:none;background:#ddd!important;color:#000!important;opacity:.4;cursor:not-allowed!important}.container__dashboard h1{font-size:clamp(1.8rem,5vmin,2.5rem);margin-bottom:1.25rem;font-family:Georgia,Times New Roman,Times,serif}.container__dashboard__field{display:flex;height:3em}.container__dashboard__field__input{padding:.75em;font-size:1rem;flex-basis:100%;border-radius:6px 0 0 6px;border:2px solid #c4c4c4}.container__dashboard__field__input:focus{outline:none;border-color:var(--primary)}.container__dashboard__field__button{border:0;width:50px;font-size:1.2em;border-radius:0 6px 6px 0;cursor:pointer}.container__dashboard__field__button:hover,.container__dashboard__field__button:focus,input:focus~.container__dashboard__field__button{background:var(--gradient);color:var(--light)}.container__dashboard__info{display:flex;justify-content:space-between;align-items:center;gap:1em;padding:.75em 0}.container__dashboard__info p{cursor:pointer}.container__dashboard__info__buttons{display:flex;gap:.5em}.container__dashboard__info__buttons__button{background:var(--gradient);color:var(--light);border:0;width:50px;padding:1em;border-radius:4px;font-size:1rem;cursor:pointer}.container__todos{border-bottom:#e6e6e6 2px solid}.container__todos ul{display:flex;flex-direction:column}.container__todos__todo{display:flex;justify-content:space-between;align-items:center;padding:1em 0;margin:0 1.5em;gap:1em}.container__todos__todo__body{display:flex;gap:.75em}.container__todos__todo__body__text{font-size:1.1rem}.container__todos__todo__button{color:red;background-color:transparent;font-size:1em;border:0;cursor:pointer;aspect-ratio:1}.container__todos__todo+li{border-top:#e6e6e6 2px solid}@media screen and (max-width: 475px){body{padding:0}.container{min-height:100vh;width:100vw;justify-content:flex-start}.container__dashboard{padding:1.5em 1em 0;font-size:1.1rem}}
