body{background-color:var(--bg-main);color:var(--text-primary);margin:0;padding:0;font-family:Josefin Sans,sans-serif}:root{--bg-main:#161722;--bg-card:#25273c;--text-primary:#cacde8;--text-hover:#e4e5f1;--text-muted:#9394a5;--border-muted:#393a4c;--accent:#5c5f7f;--header-mobile:url(/images/bg-mobile-dark.jpg);--header-desktop:url(/images/bg-desktop-dark.jpg)}body.light-theme{--bg-main:#d2d3db;--bg-card:#fafafa;--text-primary:#484b6a;--text-hover:#161722;--text-muted:#9394a5;--border-muted:#d2d3db;--accent:#cacde8;--header-mobile:url(/images/bg-mobile-light.jpg);--header-desktop:url(/images/bg-desktop-light.jpg)}header{background-image:var(--header-mobile);color:#fff;background-size:cover;max-width:100%;padding:100px 0}.navbar{justify-content:space-between;margin:-60px 30px 50px;display:flex}.navbar h1{letter-spacing:5px;font-weight:700}.theme-toggle{cursor:pointer;width:30px;height:30px;margin:auto 0;position:relative}.theme-toggle img{width:30px;height:30px;transition:opacity .4s,transform .4s;position:absolute;inset:0}.sun{opacity:1;transform:scale(1)}.moon,body.light-theme .sun{opacity:0;pointer-events:none;transform:scale(.5)}body.light-theme .moon{opacity:1;pointer-events:auto;transform:scale(1)}body,header,.todo-list,.input,.filters{transition:background-color .5s,color .5s,background-image .5s}.Create{margin:-140px 30px 0;position:relative}.rounded{pointer-events:none;border:1px solid #393a4c;border-radius:50%;width:25px;height:25px;position:absolute;top:50%;left:25px;transform:translateY(-50%)}.input{background:var(--bg-card);width:100%;height:70px;color:var(--text-primary);box-sizing:border-box;cursor:pointer;border:1px solid #0000;border-radius:2px;padding-left:65px;padding-right:15px;font-size:16px}.input::placeholder{color:#999;font-family:Josefin Sans,sans-serif}.input:hover{border:1px solid var(--text-muted);transition:border .8s ease-in-out}.input:focus{border:2px solid var(--accent);outline:none}.input:disabled{opacity:.6;cursor:not-allowed}.todo-list{background-color:var(--bg-card);border:none;flex-direction:column;gap:15px;height:100%;margin:30px;padding:10px 0;list-style-type:none;display:flex}ul,.todo-list{padding:0;list-style:none}.todo-container{cursor:grab;background-color:var(--bg-card);z-index:1;-webkit-user-select:none;user-select:none;touch-action:none;flex-direction:row;align-items:center;gap:14px;margin:0;padding:20px 25px;display:flex;position:relative;overflow:visible}.todo-container:active{cursor:grabbing}.todo-container:hover .delete-btn{opacity:1;pointer-events:auto}.todo-container:hover{z-index:10}.line{border:.1px solid #393a4c;width:100%}.todo-text{word-break:break-word;flex-grow:1;font-size:15px}.rounded2{border:1px solid var(--border-muted);cursor:pointer;background:0 0;border-radius:50%;flex-shrink:0;width:25px;height:25px;position:relative}.rounded2:after{content:"";-webkit-mask-composite:xor;opacity:0;background:linear-gradient(#c058f3,#57ddff);border-radius:50%;padding:1px;transition:opacity .3s;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.rounded2:hover{border-color:#0000}.rounded2:hover:after{opacity:1}.delete-btn{opacity:0;pointer-events:none;cursor:pointer;flex-shrink:0;width:18px;max-width:100%;height:18px;margin-left:auto;transition:opacity .2s;display:block}.analytics{justify-content:space-between;margin:0 25px;display:flex}.items-left{color:var(--text-muted)}.clear-completed{cursor:pointer;color:var(--text-muted)}.clear-completed:hover{color:var(--text-hover)}.filters{background-color:var(--bg-card);border-radius:5px;flex-direction:row;justify-content:center;gap:15px;margin:0 30px;padding:15px 0;display:flex}.filters p{color:var(--text-muted);font-size:18px}.filters p:hover{color:var(--text-hover)}.filter{cursor:pointer;color:var(--text-muted);-webkit-tap-highlight-color:transparent;font-weight:600;transition:color .3s}.filter.active{color:#3a7bfd!important}.Instruction{text-align:center;margin:40px 30px 60px}.Instruction p{color:var(--text-muted);font-size:18px}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9999;background:#0009;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.timer-modal{background:var(--bg-card);text-align:center;border-radius:15px;width:100%;max-width:350px;margin:0 20px;padding:30px;box-shadow:0 20px 40px #0006}.modal-title{color:var(--text-main);margin-bottom:10px;font-size:20px;font-weight:700}.clock-icon{width:fit-content;margin:10px auto;font-size:56px;display:block}.custom-time-input{justify-content:center;align-items:center;gap:10px;margin-bottom:25px;display:flex}.custom-time-input input{text-align:center;border:2px solid var(--border-muted);background:var(--bg-card);width:80px;height:60px;color:var(--text-main);border-radius:12px;outline:none;font-size:32px;font-weight:700}.custom-time-input input:focus{border-color:#3a7bfd}.custom-time-input span{color:var(--text-muted);font-size:18px;font-weight:700}.custom-time-input input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.custom-time-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.modal-desc{color:var(--text-muted);margin-bottom:25px;font-size:14px}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.timer-options{justify-content:space-between;gap:10px;margin-bottom:20px;display:flex}.timer-options button{color:#fff;cursor:pointer;background:#3a7bfd;border:none;border-radius:5px;flex:1;padding:12px 5px;font-weight:700;transition:opacity .2s}.timer-options button:hover{opacity:.8}.skip-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:14px;text-decoration:underline}.mobile-version{display:block}.desktop-version{display:none}@media (hover:hover){.filter:hover{color:var(--text-hover)}}@media (min-width:1024px){.mobile-version{display:none}.desktop-version{display:block}header{background-image:var(--header-desktop)}.navbar{margin:-60px 230px 50px}.Create{margin:-140px 230px 0}.todo-list{margin:30px 230px}.analytics{align-items:center}.Instruction p{font-size:30px}}