.app{max-width:800px;margin:0 auto;padding:20px;font-family:Arial,sans-serif}.app-header{text-align:center;margin-bottom:30px}.app-header h1{color:#333;font-size:2.5rem;margin:0}.app-main{background-color:#fff;border-radius:8px;box-shadow:0 2px 10px #0000001a;padding:20px}.add-todo-form{display:flex;margin-bottom:20px;gap:10px}.todo-input{flex:1;padding:10px;border:1px solid #ddd;border-radius:4px;font-size:16px}.add-button{padding:10px 20px;background-color:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:16px}.add-button:hover{background-color:#0056b3}.todos-container{margin-top:20px}.no-todos{text-align:center;color:#666;font-style:italic;padding:20px}.todos-list{list-style:none;padding:0;margin:0}.todo-item{display:flex;justify-content:space-between;align-items:center;padding:12px;border-bottom:1px solid #eee;transition:background-color .2s}.todo-item:last-child{border-bottom:none}.todo-item:hover{background-color:#f9f9f9}.todo-item.completed{opacity:.6}.todo-checkbox-label{display:flex;align-items:center;flex:1;cursor:pointer}.todo-checkbox{margin-right:10px;transform:scale(1.3)}.todo-title{font-size:16px}.todo-item.completed .todo-title{text-decoration:line-through;color:#888}.delete-button{padding:6px 12px;background-color:#dc3545;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.delete-button:hover{background-color:#c82333}.loading{text-align:center;padding:20px;font-size:18px;color:#666}.error-message{background-color:#f8d7da;color:#721c24;padding:10px;border-radius:4px;margin-bottom:15px;border:1px solid #f5c6cb}@media(max-width:600px){.app{padding:10px}.app-header h1{font-size:2rem}.add-todo-form{flex-direction:column}.todo-item{flex-direction:column;align-items:flex-start;gap:10px}.delete-button{align-self:flex-end}}