@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Outfit,sans-serif}body{width:100%;min-height:100vh;background:radial-gradient(circle at top left,#0f3d3e,#211b49 55%,#ff8fb1);display:flex;align-items:center;justify-content:center;overflow-x:hidden}#root{width:100%;display:flex;align-items:center;justify-content:center;padding:20px}.container{width:min(450px,100%);background:linear-gradient(135deg,#ffffff0f,#ffffff05);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid rgba(255,255,255,.16);border-radius:28px;padding:40px;box-shadow:0 20px 50px #0000004d;animation:containerEntry .8s cubic-bezier(.34,1.56,.64,1)}.container h1{text-align:center;font-size:36px;font-weight:600;letter-spacing:-.5px;margin-bottom:30px;color:#fff}.input-group{display:flex;gap:12px;margin-bottom:30px}.container input{flex:1;height:54px;background:#ffffff0d;border:1px solid rgba(255,255,255,.2);border-radius:14px;padding:0 20px;font-size:16px;color:#fff;outline:none;transition:all .3s ease}.container input::placeholder{color:#fff6}.container input:focus{background:#ffffff1a;border-color:#7de2d1;box-shadow:0 0 0 4px #7de2d140}.container button{padding:0 24px;height:54px;border:none;border-radius:14px;background:linear-gradient(135deg,#20c997,#0ea5e9);color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.container button:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 10px 20px #0ea5e959}.container button:active{transform:translateY(0) scale(.98)}.total-tasks{display:flex;flex-direction:column;gap:16px;max-height:400px;overflow-y:auto;padding-right:5px}.total-tasks::-webkit-scrollbar{width:4px}.total-tasks::-webkit-scrollbar-track{background:transparent}.total-tasks::-webkit-scrollbar-thumb{background:#7de2d159;border-radius:10px}.cur-task{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;transition:all .3s ease;animation:taskEntry .5s ease-out backwards}.cur-task:hover{background:#ffffff14;border-color:#7de2d173}.task-content{display:flex;flex-direction:column;gap:4px}.task-text{list-style:none;font-size:17px;color:#fff;font-weight:400}.task-time{font-size:12px;color:#fff;font-weight:300}.delete-btn{font-size:18px;cursor:pointer;opacity:.9;transition:all .2s ease;padding:8px;border-radius:50%}.delete-btn:hover{opacity:1;background:#ff787833;transform:scale(1.2) rotate(90deg)}.empty-state{text-align:center;padding:20px;color:#ffffffbf}.empty-state p{font-size:18px;margin-bottom:4px}.empty-state span{font-size:14px}@keyframes containerEntry{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes taskEntry{0%{opacity:0;transform:translate(-15px)}to{opacity:1;transform:translate(0)}}@media(max-width:500px){.container{padding:30px 20px;height:auto}.container h1{font-size:28px}.container input,.container button{height:48px;font-size:14px}.task-text{font-size:15px}.input-group{flex-direction:column;height:120px}}
