body{
    font-family: Arial, Helvetica, sans-serif;
    background:#f4f6f8;
    display:flex;
    justify-content:center;
    margin-top:100px;
}

.container{
    background:white;
    padding:30px;
    border-radius:10px;
    width:400px;
    box-shadow:0 5px 20px rgba(0,0,0,0.1);
}

h1{
    text-align:center;
}

form{
    display:flex;
    gap:10px;
}

input{
    flex:1;
    padding:10px;
    border:1px solid #ddd;
    border-radius:5px;
}

button{
    padding:10px 15px;
    border:none;
    background:#4CAF50;
    color:white;
    border-radius:5px;
    cursor:pointer;
}

.tasks{
    margin-top:20px;
}

.task{
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:#f9f9f9;
    padding:10px;
    margin-bottom:10px;
    border-radius:5px;
}

.done{
    text-decoration:line-through;
    color:gray;
}

.delete{
    background:#ff4d4d;
}