:root{--purple: #6C63FF;--black: #252525;--white: #F7F7F7;--red: #F32013}*{margin:0;box-sizing:border-box;font-family:kanit,sans-serif;color:var(--white)}header{margin:20px;text-align:center}body{margin:1rem 1rem 0;display:flex;align-items:center;justify-content:center;color:var(--white);background-color:var(--black)}input[type=text]{border:1px solid var(--white);background-color:transparent;border-radius:5px;padding:8px 16px;font-size:1.5rem}::placeholder{color:#666}.handle-todo-container{flex-wrap:wrap;display:flex;gap:16px}.add-todo{flex-grow:1}button{font-size:1.2rem;padding:10px 22px;background-color:var(--purple);border-radius:5px;color:var(--white);text-transform:uppercase}button:hover{cursor:pointer}.danger{background-color:var(--red)}.not-found{margin:30px;place-items:center}main{min-height:75vh}footer{text-align:center;width:100%}.todo-container{margin-top:1rem;padding:0 5rem;place-self:center;display:grid;width:100%}hr:last-of-type{display:none}.todo{margin:1rem 0;display:flex;gap:2rem;align-items:center;font-size:1.5rem}span{flex-grow:1;max-width:37vw;word-break:break-all}input[type=checkbox]{width:2rem;height:2rem;margin-right:.75rem}hr{border-color:var(--purple)}.icon{height:3rem;padding:10px}.icon:hover{background-color:#666;cursor:pointer}@media (max-width: 640px){.todo-container{padding:0}span{max-width:50vw}.edit{width:50vw}}