body{font-family:Arial,sans-serif;background-color:#121212;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:90vh;background-image:url(/assets/background-LSLr2bm0.png)}.todo-container{max-width:90%;margin:20px auto;padding:20px;border:1px solid #333333;border-radius:10px;background-color:#1f1f1f}h1{text-align:center}h2{margin-top:20px;font-size:18px}input[type=text]{width:calc(100% - 20px);padding:10px;margin-top:10px;border:none;border-radius:5px;background-color:#333;color:#fff}button{width:calc(100% - 20px);padding:10px;margin-top:10px;border:none;border-radius:5px;cursor:pointer;background-color:#4caf50;color:#fff}button:hover{background-color:#45a049}ul{padding:0;list-style-type:none}li{margin-bottom:5px;padding:10px;border-radius:5px;background-color:#333;display:flex;flex-direction:column;align-items:center;word-break:break-all}span{flex-grow:1;text-align:center}.delete-btn,.complete-btn{padding:6px 10px;border:none;border-radius:5px;cursor:pointer;font-size:14px;margin-top:5px}.delete-btn{background-color:#f33;color:#fff}.complete-btn{background-color:#4caf50;color:#fff}.complete-btn:hover{background-color:#45a049}.completed-tasks{margin-top:20px}@media screen and (max-width: 400px){.todo-container{max-width:95%;padding:15px}input[type=text],button,li{font-size:14px}.delete-btn,.complete-btn{padding:4px 6px;font-size:12px}}@media screen and (max-width: 300px){.delete-btn,.complete-btn{padding:2px 4px;font-size:10px}}
