@import"https://fonts.googleapis.com/css2?family=Rubik+Distressed&display=swap";body{background:linear-gradient(135deg,#f9fafb,#91afea);margin:0;min-height:100vh}.app{text-align:center;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}.home{padding:20px}.app h1{font-family:Rubik Distressed,system-ui;font-weight:400;font-style:normal;font-size:60px;padding:0 18px 0 0}.app p{font-family:montserrat;margin:-42px 29px 44px 3px;color:#fff;background:linear-gradient(90deg,#feffff,#fff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 8px rgb(255 255 255 / 81%)}.task-form{display:flex;justify-content:center;margin-bottom:20px}.task-input{width:300px;padding:10px;margin-right:10px;border:2px solid;border-radius:5px;background:#fffcf96b}.task-input:hover{transform:scale(1.01)}.task-section{width:30%;border:1px solid rgba(255,255,255,.35);padding:10px;border-radius:5px;transition:transform .18s ease,box-shadow .25s ease,border-color .25s ease;background:linear-gradient(135deg,#ffffff42,#ffffff1f);-webkit-backdrop-filter:blur(18px) saturate(180%);backdrop-filter:blur(18px) saturate(180%);box-shadow:0 1px 1px #fff6 inset,0 4px 24px #0000001f}.task-section:hover{transform:scale(1.05)}.tasks-sections{display:flex;justify-content:space-around;margin-top:30px}.submit-button{border:1px solid rgba(156,39,176,.7);box-shadow:inset 0 1px 3px #9c27b04d;background:linear-gradient(135deg,#e133ffeb,#673ab71a);padding:6px 9px;color:#fff;border-radius:16px;cursor:pointer;transition:transform .3s}.submit-button:hover{background-color:#d7ffc3;transform:translateY(-2px);box-shadow:0 4px 8px #250841ba}.task-section h2{text-align:center;margin-bottom:10px}.task-section li{display:flex;justify-content:space-around;align-items:center;font-family:cursive;gap:10px;flex-wrap:wrap;font-weight:500;margin:10px 6px 0 -26px}.progress-tracker{margin:67px 32px 11px 51px;text-align:center}.progress-tracker p{color:#fff;text-shadow:unset;padding:10px 0 1px 4px;margin-bottom:2px;font-size:large}.progress-bar{width:100%;height:20px;background-color:#f0f0f0;border-radius:10px;overflow:hidden;margin-top:10px}.progress{height:100%;background-color:#4caf50;transition:width .3s ease}.item{background:linear-gradient(135deg,#ffffff59,#ffffff26);padding:5px 10px;-webkit-backdrop-filter:blur(12px) saturate(160%);backdrop-filter:blur(12px) saturate(160%);border:1px solid rgba(255,255,255,.25);border-radius:10px;box-shadow:0 2px 12px #00000014;text-transform:capitalize}.del-btn{background:#f6a5a5f5;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid #ff8383;border-radius:12px;box-shadow:inset 0 0 8px #d66363ed,0 2px 8px #0000000f;color:#fff;font-family:Inter,sans-serif;font-weight:600;font-size:clamp(13px,4vw,13px);padding:8px 37px;display:inline-flex;align-items:center;gap:8px;transition:all .2s ease}.task-section button{flex:1;max-width:123px;margin-left:10px;cursor:pointer}.del-btn:hover{background:#ff6b6b;box-shadow:inset 0 0 12px #ff6b6b66,0 4px 12px #00000026;transform:translateY(-2px)}.todo-btn{background:#53aeffab;border:1px solid rgb(0 120 226);box-shadow:0 0 0 8px #88c3f96e inset,0 2px 8px #45a7ff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;color:#fff;font-family:Inter,sans-serif;font-weight:600;font-size:clamp(13px,4vw,13px);padding:8px 11px;display:inline-flex;align-items:center;gap:8px;transition:all .2s ease}.todo-btn:hover{background:#2995f4f7;box-shadow:0 0 0 12px #45a7ff33 inset,0 4px 12px #45a7ff26;transform:translateY(-2px)}.ong-btn{background:#f3bd65;box-shadow:0 0 0 8px #ffa0070a inset,0 2px 8px #fdba4e26;border:1px solid rgb(247 163 28);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;color:#fff;font-family:Inter,sans-serif;font-weight:600;font-size:clamp(13px,4vw,13px);padding:8px 11px;display:inline-flex;align-items:center;gap:8px;transition:all .2s ease}.ong-btn:hover{background:#ee9300;box-shadow:0 0 0 12px #de9e3617 inset,0 4px 12px #5a3c0c40;transform:translateY(-2px)}.comp-btn{background:#38e6837d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgb(27 183 95 / 97%);border-radius:12px;box-shadow:inset 0 0 8px #0bb92870,0 2px 8px #36ec8540;color:#fff;font-family:Inter,sans-serif;font-weight:600;font-size:clamp(13px,4vw,13px);padding:8px 11px;display:inline-flex;align-items:center;gap:8px;transition:all .2s ease}.comp-btn:hover{background:#28b967f7;box-shadow:0 0 0 12px #10b70226 inset,0 4px 12px #0b481d52;transform:translateY(-2px)}.todo-icon{padding:6px 20px;display:inline-flex;align-items:center;font-size:33px;margin:-11px}.ong-icon{padding:2px 24px;display:inline-flex;align-items:center;font-size:33px;margin:-11px}.comp-icon{padding:3px 28px;display:inline-flex;align-items:center;font-size:33px;margin:-11px}.add-icon{display:inline-flex;padding:1px 2px;margin-left:-7px;margin-bottom:-3px}