.todo-app{max-width:600px;margin:0 auto;padding:2rem;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}h1{text-align:center;color:#333;margin-bottom:2rem;font-size:2.5rem;font-weight:700}.input-section{display:flex;gap:.5rem;margin-bottom:1.5rem}.todo-input{flex:1;padding:.75rem 1rem;border:2px solid #e1e5e9;border-radius:8px;font-size:1rem;transition:border-color .2s}.todo-input:focus{outline:none;border-color:#646cff}.add-button{padding:.75rem 1.5rem;background-color:#646cff;color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s}.add-button:hover{background-color:#535bf2}.filter-section{display:flex;gap:.5rem;margin-bottom:1.5rem;justify-content:center}.filter-button{padding:.5rem 1rem;background-color:#f3f4f6;border:1px solid #e5e7eb;border-radius:6px;font-size:.875rem;cursor:pointer;transition:all .2s}.filter-button:hover{background-color:#e5e7eb}.filter-button.active{background-color:#646cff;color:#fff;border-color:#646cff}.todo-list{margin-bottom:1.5rem}.empty-message{text-align:center;color:#6b7280;font-style:italic;padding:2rem}.todo-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;margin-bottom:.5rem;transition:all .2s}.todo-item:hover{background-color:#f3f4f6}.todo-item.completed{opacity:.6}.todo-checkbox{width:1.25rem;height:1.25rem;cursor:pointer}.todo-text{flex:1;font-size:1rem;color:#374151}.todo-item.completed .todo-text{text-decoration:line-through;color:#6b7280}.delete-button{padding:.375rem .75rem;background-color:#ef4444;color:#fff;border:none;border-radius:6px;font-size:.875rem;cursor:pointer;transition:background-color .2s}.delete-button:hover{background-color:#dc2626}.actions-section{text-align:center}.clear-button{padding:.5rem 1rem;background-color:#6b7280;color:#fff;border:none;border-radius:6px;font-size:.875rem;cursor:pointer;transition:background-color .2s}.clear-button:hover{background-color:#4b5563}@media (max-width: 640px){.todo-app{padding:1rem}.filter-section{flex-wrap:wrap}.filter-button{flex:1;min-width:100px}}