*{box-sizing:border-box;margin:0;padding:0;font-family:Segoe UI,sans-serif}body{background:linear-gradient(135deg,#667eea,#764ba2);justify-content:center;align-items:center;min-height:100vh;display:flex}.app{background:#fff;border-radius:16px;width:420px;padding:25px;box-shadow:0 10px 30px #0003}.title{text-align:center;color:#333;margin-bottom:20px}.form{flex-direction:column;gap:10px;display:flex}.form input{border:1px solid #ddd;border-radius:8px;outline:none;padding:10px;transition:all .2s}.form input:focus{border-color:#667eea}.btn{color:#fff;cursor:pointer;background:#667eea;border:none;border-radius:8px;padding:10px;transition:all .2s}.btn:hover{background:#5a67d8}.todo-list{margin-top:20px}.todo-item{background:#f9f9f9;border-radius:10px;flex-direction:column;margin-bottom:10px;padding:12px;transition:all .2s;display:flex}.todo-item:hover{transform:translateY(-2px)}.todo-top{justify-content:space-between;align-items:center;display:flex}.todo-text{flex:1;margin-left:10px}.completed{color:#aaa;text-decoration:line-through}.meta{color:#666;margin-top:5px;font-size:12px}.filters{justify-content:space-between;margin-top:15px;display:flex}.filters button{cursor:pointer;background:#eee;border:none;border-radius:8px;flex:1;margin:0 5px;padding:8px}.filters button:hover{background:#ddd}