body{margin:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#f4f6f8}.container{display:flex;justify-content:center;align-items:flex-start;padding-top:60px;min-height:100vh}.todo-app{background-color:#fff;padding:30px;width:100%;max-width:500px;border-radius:10px;box-shadow:0 8px 20px rgba(0,0,0,.1)}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.refresh-btn{font-size:20px;background:none;border:none;cursor:pointer;color:#666;transition:transform .2s,color .3s}.refresh-btn:hover{transform:rotate(180deg);color:#007bff}.todo-app h1{margin:0;font-size:24px;color:#333}.form{display:flex;gap:10px;margin-bottom:20px}.input{flex:1;padding:10px;font-size:16px;border:2px solid #ddd;border-radius:5px;outline:none}.input:focus{border-color:#007bff}.add-btn{padding:10px 16px;background-color:#007bff;color:#fff;border:none;font-weight:700;border-radius:5px;cursor:pointer;transition:background .3s}.add-btn:hover{background-color:#0056b3}.todo-list{list-style:none;padding:0;margin:0}.todo-item{justify-content:space-between;padding:12px 8px;border-bottom:1px solid #e0e0e0}.checkbox-wrapper,.todo-item{display:flex;align-items:center}.checkbox-wrapper{gap:10px;flex:1}.todo-text{font-size:16px}.todo-text.done{text-decoration:line-through;color:#888}.delete-btn{background:transparent;border:none;color:#dc3545;font-size:18px;cursor:pointer;transition:color .3s}.delete-btn:hover{color:#a71d2a}.footer{margin-top:20px;display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:10px}.counts{display:flex;flex-direction:column;gap:5px;font-size:14px;color:#444}.clear-btn{background-color:#f44336;color:#fff;border:none;padding:6px 12px;border-radius:5px;cursor:pointer}.clear-btn:disabled{background-color:#ccc;cursor:not-allowed}.filters{display:flex;gap:10px;margin-bottom:10px;justify-content:center}.filters button{padding:6px 12px;border:1px solid #ddd;background-color:#fff;border-radius:4px;cursor:pointer;transition:background .3s}.filters button.active{background-color:#007bff;color:#fff;border-color:#007bff}