*{box-sizing:border-box;margin:0;padding:0}body{background:url(/image/bg-1.jpg) 50%/cover no-repeat;justify-content:center;align-items:center;width:100%;min-height:100vh;padding:20px;font-family:Poppins,sans-serif;display:flex}.input-container{background:#ffffff26;border-radius:12px;padding:5px;display:flex}.input-container input{color:#fff;background:0 0;border:none;outline:none;flex:1;padding:8px}.input-container input::placeholder{color:#ddd;opacity:.7}.input-container button{color:#fff;opacity:.8;background:#8e5093;border:none;border-radius:10px;padding:8px 14px;font-weight:500}.input-container button:hover{opacity:1;transform:scale(1.05)}.todo-item{opacity:.8;background:#8e5093;border-radius:10px;justify-content:space-between;align-items:center;margin-bottom:10px;padding:6px 12px;transition:all .3s;display:flex;overflow:hidden}.todo-item:hover{opacity:1;transform:translateY(-2px)}.todo-text{flex:1}.todo-actions{gap:8px;display:flex}.todo-actions button{cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;transition:all .3s;display:flex}.delete-btn{color:#fff;background:#ff4d4d;margin-left:10px}.delete-btn:hover{background:#e60000;transform:scale(1.1)}.done-btn{color:#fff;background:#4dabf7}.done-btn:hover{background:#1c7ed6;transform:scale(1.1)}.todo-text{word-wrap:break-word;flex:1;min-width:0}.todo-container{-webkit-backdrop-filter:blur(11px);backdrop-filter:blur(11px);color:#fff;background:#ffffff26;border:1px solid #ffffff1a;border-radius:20px;width:100%;max-width:400px;margin:20px auto;padding:25px;transition:all .3s}.todo-container:hover{transform:translateY(-5px)}.todo-title{text-align:center;margin-bottom:20px;font-size:26px;font-weight:600}.mark-all-btn{opacity:.8;color:#fff;cursor:pointer;background:#8e5093;border:none;border-radius:10px;width:100%;margin-top:15px;padding:10px;transition:all .3s}.mark-all-btn:hover{opacity:1;transform:scale(1.03)}hr{background:#fff3;border:none;height:1px;margin:10px 0}.todo-list{max-height:200px;padding-right:5px;overflow-y:auto}.todo-list::-webkit-scrollbar{width:6px}.todo-list::-webkit-scrollbar-track{background:0 0}.todo-list::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:10px}.todo-list::-webkit-scrollbar-thumb:hover{background:#fff9}.empty-msg{text-align:center;color:#ddd;opacity:.8;padding:20px;font-size:14px}
