*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,sans-serif}body{background-color:#121212;color:#e0e0e0;display:flex;justify-content:center;align-items:center;min-height:100vh;padding:20px}.container{width:100%;max-width:700px;background:#1e1e1e;padding:20px;border-radius:8px;box-shadow:0 2px 10px #ffffff1a}h1{text-align:center;font-size:26px;color:#fff;margin-bottom:15px}.input{display:flex;gap:8px}input{flex:1;padding:10px;border:1px solid #333;border-radius:5px;font-size:16px;background:#2c2c2c;color:#e0e0e0}input::placeholder{color:#aaa}.add-btn{padding:10px 15px;border:none;background:#007bff;color:#fff;font-size:16px;border-radius:5px;cursor:pointer}.add-btn:hover{background:#0056b3}.task-list{margin-top:15px}.task{display:flex;align-items:center;justify-content:space-between;background:#2a2a2a;padding:10px;margin-bottom:8px;border-radius:5px;min-height:50px}.list-num{font-weight:700;color:#fff;margin-right:10px}.text{flex:1;font-size:16px;color:#e0e0e0;overflow-wrap:anywhere;word-break:break-word}.btn{display:flex;gap:5px}button{padding:6px 12px;border:none;font-size:14px;cursor:pointer;border-radius:5px}.delete-btn{background:#d9534f;color:#fff}.delete-btn:hover{background:#b52b27}.complete-btn{background:#28a745;color:#fff}.complete-btn:hover{background:#218838}.task.done{background:#333;text-decoration:line-through;color:#888}.task.done .text{color:#888}