*{box-sizing:border-box;margin:0;padding:0}ul{list-style:none}.todo{background-color:#f9f9f9;border-radius:16px;width:max(80%,400px);margin:20px auto;padding:20px;box-shadow:0 2px 4px #0000001a}.todo__form{margin-bottom:10px;padding:10px;display:flex}.todo__input{border:1px solid #ccc;border-radius:8px;flex:1px;margin-right:10px;padding:10px;font-size:1.2em}.todo__input--edit{flex-grow:1}.todo__button{cursor:pointer;color:#fff;border:none;border-radius:8px;padding:10px;font-size:1.2em}.todo__button--add{background-color:#4984e4}.todo__item{border-bottom:1px solid #eee;justify-content:space-between;align-items:center;gap:10px;padding:10px;display:flex}.todo__check{cursor:pointer;accent-color:#999;width:20px;height:20px}.todo__label{flex:1}.todo__button--edit,.todo__button--delete{font-size:.8em}.todo__item--complete .todo__label{color:#999;text-decoration:line-through}