*{box-sizing:border-box;margin:0;padding:0;font-family:Poppins,sans-serif}body{background:linear-gradient(135deg,#f7f3ee,#efe6dd);min-height:100vh}.container{background:linear-gradient(135deg,#f8eee5,#fffaf5);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.todo-card{background:#fffaf5f2;border-radius:25px;width:100%;max-width:550px;padding:30px;box-shadow:0 15px 35px #8b5e3c26}.todo-card:hover{transform:translateY(-5px)}.todo-card h1{text-align:center;color:#6f4e37;margin-bottom:30px;font-size:2rem}.todo-form{gap:12px;margin-bottom:25px;display:flex}.todo-form input{color:#4b3621;background:#fff;border:2px solid #e5d7c8;border-radius:12px;outline:none;flex:1;padding:15px;font-size:16px;transition:all .3s}.todo-form input::placeholder{color:#9b8a7a}.todo-form button{color:#fff;cursor:pointer;background:#8b5e3c;border:none;border-radius:12px;padding:15px 24px;font-size:15px;transition:all .3s}.filters{justify-content:center;gap:12px;margin-bottom:25px;display:flex}.filters button{color:#6f4e37;cursor:pointer;background:#f7efe8;border:1px solid #dbc8b7;border-radius:30px;padding:10px 18px;transition:all .3s}.filters button:hover{color:#fff;background:#8b5e3c}.todo-list{list-style:none}.todo-item{background:#fffaf5;border:1px solid #eadfd2;border-left:6px solid #8b5e3c;border-radius:18px;justify-content:space-between;align-items:center;margin-bottom:15px;padding:18px;transition:all .3s;display:flex;box-shadow:0 8px 20px #8b5e3c14}.todo-item span{color:#4b3621;font-size:17px;font-weight:500}.todo-item div{gap:10px;display:flex}.todo-item button{cursor:pointer;background:#efe6dd;border:none;border-radius:50%;width:40px;height:40px;font-size:16px;transition:all .3s}.task-content{align-items:center;gap:12px;display:flex}.task-content input{cursor:pointer;width:18px;height:18px}.completed{opacity:.6;text-decoration:line-through}.task-stats{background:#f7efe8;border-radius:15px;justify-content:space-around;margin-bottom:25px;padding:15px;display:flex}.task-stats p{color:#6f4e37;font-weight:600}.empty-message{text-align:center;color:#8b5e3c;background:#faf6f1;border:1px dashed #c69c6d;border-radius:18px;padding:25px 15px;font-weight:500;line-height:1.6}.todo-item button{color:#6f4e37;justify-content:center;align-items:center;display:flex}.todo-item button:hover{color:#fff;background:#8b5e3c}.header{text-align:center;margin-bottom:25px}.header h1{color:#6f4e37;font-size:2.2rem}.header p{color:#9b8a7a;margin-top:8px}.task-stats{margin-bottom:18px 0;justify-content:center;gap:10px;display:flex}.stat-card{text-align:center;background:#faf6f1;border:1px solid #ead8c8;border-radius:12px;width:95px;padding:10px}.stat-card h3{color:#8b5e3c;margin:0;font-size:20px}.stat-card span{color:#6f4e37;font-size:12px}.todo-form button{background:linear-gradient(135deg,#8b5e3c,#c69c6d)}.task-content input[type=checkbox]{appearance:none;cursor:pointer;background:#fffaf5;border:2px solid #8b5e3c;border-radius:6px;width:20px;height:20px;position:relative}.task-content input[type=checkbox]:checked{background:#8b5e3c;border-color:#8b5e3c}.task-content input[type=checkbox]:checked:after{content:"✓";color:#fff;font-size:14px;font-weight:700;position:absolute;top:-2px;left:3px}.todo-form button:hover{background:linear-gradient(135deg,#6f4e37,#8b5e3c)}.filters button{transition:all .3s}.filters button:hover{transform:translateY(-3px)}.todo-item{animation:.4s slideIn}.todo-list{padding:0}.todo-item{background:#fffaf5;border:1px solid #ead8c8;border-radius:18px;justify-content:space-between;align-items:center;margin-bottom:14px;padding:16px;transition:all .3s;display:flex;box-shadow:0 8px 20px #8b5e3c14}.todo-item:hover{transform:translateY(-3px);box-shadow:0 12px 25px #8b5e3c26}.task-content{flex:1;align-items:center;gap:12px;min-width:0;display:flex}.task-content span{color:#5c4033;font-weight:500}.done span{opacity:.55;text-decoration:line-through}.task-actions{gap:10px;display:flex}.task-actions button{color:#8b5e3c;cursor:pointer;background:#f3e4d6;border:none;border-radius:50%;justify-content:center;align-items:center;width:35px;height:35px;transition:all .3s;display:flex}.task-actions button:first-child{color:#fff;background:#8b5e3c}.edit-input{color:#4b3621;background:#fff;border:2px solid #8b5e3c;border-radius:12px;outline:none;flex:1;width:100%;min-width:220px;padding:10px 14px;font-size:16px;font-weight:500}.edit-input:focus{border-color:#6f4e37;box-shadow:0 0 8px #8b5e3c33}.todo-form input{background:#fffaf5;border:1px solid #d8b89c;border-radius:15px;outline:none;padding:12px 15px;transition:all .3s}.todo-form input:focus{border-color:#8b5e3c;box-shadow:0 0 8px #8b5e3c33}@keyframes slideIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@media (width<=600px){.todo-card{padding:20px}.header h1{font-size:1.8rem}.task-stats{flex-direction:row;justify-content:space-between;gap:8px;display:flex}.edit-input{width:100%;min-width:0}.stat-card{width:30%;padding:10px 5px}.stat-card h3{font-size:18px}.stat-card span{font-size:11px}.todo-item{flex-direction:column;align-items:flex-start;gap:12px}.task-actions{justify-content:flex-end;width:100%}.filters{flex-wrap:wrap;gap:8px;display:flex}}
