@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";.auth-page{background:radial-gradient(circle at 12% 15%,#6366f12e,#0000 32%),radial-gradient(circle at 88% 80%,#7c3aed26,#0000 34%),radial-gradient(circle at 50% 110%,#3b82f614,#0000 35%),#07070b;justify-content:center;align-items:center;width:100%;min-height:100dvh;padding:30px 20px;display:flex;position:relative;overflow:hidden}.auth-page:before,.auth-page:after{content:"";pointer-events:none;filter:blur(110px);opacity:.22;border-radius:50%;width:420px;height:420px;position:absolute}.auth-page:before{background:#6366f1;top:-200px;left:-170px}.auth-page:after{background:#7c3aed;bottom:-200px;right:-190px}.auth-container{z-index:10;flex-direction:column;align-items:center;width:100%;max-width:440px;max-height:100%;display:flex;position:relative}.auth-name{color:#fff;letter-spacing:-.6px;align-items:center;gap:9px;margin-bottom:11px;font-size:23px;font-weight:800;display:flex}.auth-icon{color:#fff;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:10px;justify-content:center;align-items:center;width:37px;height:37px;font-size:18px;display:flex;box-shadow:0 8px 25px #6366f14d,inset 0 1px 1px #ffffff38}.auth-card{z-index:10;-webkit-backdrop-filter:blur(28px)saturate(140%);background:linear-gradient(145deg,#ffffff18,#ffffff09);border:1px solid #ffffff1a;border-radius:22px;flex-shrink:1;width:100%;padding:26px 36px 24px;position:relative;box-shadow:0 30px 80px #0000007a,0 10px 30px #0003,inset 0 1px #ffffff14}.auth-card:before{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#fff3,#0000);width:84%;height:1px;position:absolute;top:0;left:8%}.auth-header{text-align:center;margin-bottom:20px}.auth-header h1{color:#fff;letter-spacing:-.7px;margin:0 0 6px;font-size:26px;font-weight:750;line-height:1.2}.auth-header p{color:#ffffff85;margin:0;font-size:13px;line-height:1.4}.auth-form{z-index:10;flex-direction:column;gap:13px;width:100%;display:flex;position:relative}.auth-field{z-index:10;width:100%;position:relative}.auth-field label{color:#ffffffd1;margin-bottom:6px;font-size:12px;font-weight:600;display:block}.auth-field input{z-index:20;color:#fff;pointer-events:auto;background:#00000038;border:1px solid #ffffff1a;border-radius:11px;outline:none;width:100%;height:46px;padding:0 14px;font-family:inherit;font-size:13px;transition:border-color .2s,background .2s,box-shadow .2s;position:relative}.auth-field input::placeholder{color:#ffffff4d}.auth-field input:hover{border-color:#ffffff2b}.auth-field input:focus{background:#0000004d;border-color:#818cf8e6;box-shadow:0 0 0 3px #6366f11f,0 0 25px #6366f114}.auth-field input.input-error{border-color:#f87171bf}.auth-field input.input-error:focus{border-color:#f87171;box-shadow:0 0 0 3px #f871711a}.field-error{color:#fca5a5;margin-top:5px;font-size:11px;line-height:1.35;display:block}.password-wrapper{z-index:20;width:100%;position:relative}.password-wrapper input{padding-right:45px}.password-toggle{z-index:30;color:#ffffff80;cursor:pointer;background:0 0;border:none;border-radius:7px;justify-content:center;align-items:center;width:28px;height:28px;font-size:15px;transition:color .2s,background .2s;display:flex;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.password-toggle:hover{color:#fff;background:#ffffff14}.password-strength{justify-content:space-between;align-items:center;margin-top:5px;display:flex}.strength-bars{gap:4px;display:flex}.strength-bars span{background:#ffffff1a;border-radius:10px;width:35px;height:3px}.strength-bars span.active{background:#6366f1;box-shadow:0 0 7px #6366f159}.password-strength small{font-size:10px;font-weight:600}.strength-weak{color:#f87171}.strength-medium{color:#fbbf24}.strength-strong{color:#4ade80}.terms-container{width:100%}.terms-label{color:#ffffff8c;cursor:pointer;align-items:flex-start;gap:8px;font-size:11px;line-height:1.45;display:flex}.terms-label input{accent-color:#6366f1;cursor:pointer;flex-shrink:0;width:14px;height:14px;margin-top:1px}.terms-label a{color:#a5b4fc;text-decoration:none}.terms-label a:hover{color:#c4b5fd;text-decoration:underline}.auth-options{justify-content:space-between;align-items:center;margin-top:-2px;font-size:11px;display:flex}.remember-me{color:#ffffff8c;cursor:pointer;align-items:center;gap:6px;display:flex}.remember-me input{accent-color:#6366f1;cursor:pointer;width:14px;height:14px}.auth-options a{color:#a5b4fc;text-decoration:none;transition:color .2s}.auth-options a:hover{color:#c4b5fd}.form-error{color:#fca5a5;background:#f8717112;border:1px solid #f8717133;border-radius:9px;padding:9px 11px;font-size:11px;line-height:1.4}.auth-button{z-index:20;color:#fff;cursor:pointer;background:linear-gradient(135deg,#6366f1,#7c3aed);border:1px solid #ffffff1f;border-radius:11px;width:100%;height:46px;margin-top:1px;font-family:inherit;font-size:13px;font-weight:700;transition:transform .2s,box-shadow .2s,filter .2s;position:relative;box-shadow:0 10px 25px #6366f133,inset 0 1px #ffffff2e}.auth-button:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 15px 35px #6366f14d,inset 0 1px #fff3}.auth-button:active:not(:disabled){transform:translateY(0)}.auth-button:disabled{opacity:.55;cursor:not-allowed}.auth-bottom{color:#ffffff7a;justify-content:center;align-items:center;gap:6px;margin-top:16px;font-size:12px;display:flex}.auth-bottom a{color:#a5b4fc;font-weight:600;text-decoration:none}.auth-bottom a:hover{color:#c4b5fd}.auth-footer{color:#ffffff40;text-align:center;margin:7px 0 0;font-size:9px}.auth-field input:focus-visible,.auth-button:focus-visible,.password-toggle:focus-visible,.auth-bottom a:focus-visible,.auth-options a:focus-visible,.terms-label a:focus-visible{outline-offset:2px;outline:2px solid #818cf8cc}@media (width>=1200px){.auth-page{padding:40px 30px}.auth-container{max-width:460px}.auth-card{padding-left:38px;padding-right:38px}}@media (width<=1024px){.auth-page{padding:32px 24px}.auth-container{width:100%;max-width:440px}.auth-card{width:100%}}@media (width<=768px){.auth-page{-webkit-overflow-scrolling:touch;width:100%;padding:28px 20px;overflow:hidden auto}.auth-container{width:100%;max-width:430px;margin:auto}.auth-name{margin-bottom:12px;font-size:22px}.auth-icon{width:36px;height:36px;font-size:17px}.auth-card{border-radius:20px;width:100%;padding:27px 30px 25px}.auth-header{margin-bottom:19px}.auth-header h1{font-size:25px}.auth-header p{font-size:12px}.auth-form{gap:13px}}@media (width<=600px){.auth-page{align-items:center;min-height:100dvh;padding:24px 16px;overflow:hidden auto}.auth-container{width:100%;max-width:420px}.auth-name{letter-spacing:-.5px;gap:8px;margin-bottom:10px;font-size:21px}.auth-icon{border-radius:9px;width:35px;height:35px;font-size:16px}.auth-card{border-radius:19px;padding:25px 24px 23px}.auth-header{margin-bottom:18px}.auth-header h1{letter-spacing:-.6px;font-size:23px}.auth-header p{font-size:12px;line-height:1.5}.auth-form{gap:12px}.auth-field label{margin-bottom:6px;font-size:11px}.auth-field input{border-radius:10px;width:100%;height:45px;padding:0 13px;font-size:13px}.password-wrapper input{padding-right:46px}.password-toggle{width:30px;height:30px;right:8px}.password-strength{gap:10px}.strength-bars{flex:1}.strength-bars span{flex:1;width:auto;max-width:none}.password-strength small{white-space:nowrap}.auth-options{gap:12px;font-size:10px}.remember-me{gap:5px}.remember-me input{width:14px;height:14px}.terms-label{gap:7px;font-size:10px;line-height:1.5}.terms-label input{width:14px;height:14px}.form-error{padding:9px 10px;font-size:10px}.field-error{font-size:10px}.auth-button{border-radius:10px;width:100%;height:45px;font-size:12px}.auth-bottom{text-align:center;gap:5px;margin-top:14px;font-size:11px}.auth-footer{margin-top:7px;font-size:8px}}@media (width<=480px){.auth-page{padding:20px 13px}.auth-container{max-width:100%}.auth-name{font-size:20px}.auth-icon{width:34px;height:34px;font-size:15px}.auth-card{border-radius:18px;padding:23px 20px 21px}.auth-header{margin-bottom:17px}.auth-header h1{font-size:22px}.auth-header p{font-size:11px}.auth-form{gap:11px}.auth-field input{height:44px;font-size:12px}.auth-button{height:44px}.auth-options,.terms-label,.auth-bottom{font-size:10px}}@media (width<=360px){.auth-page{padding:15px 9px}.auth-name{gap:7px;margin-bottom:8px;font-size:18px}.auth-icon{border-radius:8px;width:31px;height:31px;font-size:14px}.auth-card{border-radius:16px;padding:20px 15px 18px}.auth-header{margin-bottom:14px}.auth-header h1{font-size:20px}.auth-header p{font-size:10px}.auth-form{gap:10px}.auth-field label{margin-bottom:5px;font-size:10px}.auth-field input{border-radius:9px;height:42px;padding:0 11px;font-size:12px}.password-wrapper input{padding-right:43px}.password-toggle{width:28px;height:28px;font-size:14px;right:6px}.password-strength{gap:7px}.strength-bars{gap:3px}.strength-bars span{height:3px}.password-strength small{font-size:9px}.auth-options{gap:7px;font-size:9px}.remember-me{gap:4px}.remember-me input{width:13px;height:13px}.terms-label{gap:6px;font-size:9px;line-height:1.45}.terms-label input{width:13px;height:13px}.field-error{margin-top:4px;font-size:9px}.form-error{padding:8px 9px;font-size:9px}.auth-button{border-radius:9px;height:42px;font-size:11px}.auth-bottom{margin-top:12px;font-size:9px}.auth-footer{font-size:7px}}@media (width<=319px){.auth-page{padding:12px 7px}.auth-card{padding:18px 12px 16px}.auth-name{font-size:17px}.auth-header h1{font-size:19px}.auth-header p{font-size:9px}.auth-field input{height:40px;font-size:11px}.auth-button{height:40px;font-size:10px}.terms-label,.auth-options{font-size:8px}}@media (height<=700px){.auth-page{-webkit-overflow-scrolling:touch;align-items:flex-start;padding-top:18px;padding-bottom:18px;overflow-y:auto}.auth-container{margin:auto}.auth-name{margin-bottom:8px}.auth-card{padding-top:21px;padding-bottom:19px}.auth-header{margin-bottom:14px}.auth-form{gap:10px}}@media (height<=560px){.auth-page{padding-top:10px;padding-bottom:10px}.auth-name{margin-bottom:6px}.auth-card{padding-top:17px;padding-bottom:15px}.auth-header{margin-bottom:10px}.auth-header h1{font-size:20px}.auth-form{gap:8px}.auth-field input,.auth-button{height:40px}.auth-bottom{margin-top:9px}}@media (width<=768px) and (orientation:landscape){.auth-page{align-items:flex-start;min-height:100dvh;padding:14px 20px 20px;overflow-y:auto}.auth-container{margin:0 auto}.auth-name{margin-bottom:7px}.auth-card{padding-top:18px;padding-bottom:18px}.auth-header{margin-bottom:11px}.auth-header h1{font-size:21px}.auth-form{gap:9px}.auth-field input,.auth-button{height:41px}}@media (hover:none) and (pointer:coarse){.password-toggle{min-width:32px;min-height:32px}.remember-me{min-height:32px}.terms-label{min-height:28px}.auth-button{min-height:44px}}@media (width>=390px) and (width<=600px){.auth-card{padding-left:23px;padding-right:23px}.auth-field input,.auth-button{height:45px}}@media (prefers-reduced-motion:reduce){.auth-field input,.password-toggle,.auth-button,.auth-options a,.auth-bottom a{transition:none!important}.auth-button:hover:not(:disabled){transform:none}}@media (forced-colors:active){.auth-card,.auth-field input,.auth-button{forced-color-adjust:none}.auth-field input,.auth-button{border:1px solid canvastext}}nav{-webkit-backdrop-filter:blur(18px);z-index:100;background:#ffffff14;border:1px solid #ffffff2e;border-radius:60px;justify-content:space-between;align-items:center;width:70vw;height:70px;padding:0 30px;display:flex;position:fixed;top:20px;left:15vw;box-shadow:0 8px 32px #00000040,inset 0 1px #ffffff1f}nav:before{content:"";border-radius:inherit;opacity:.5;pointer-events:none;z-index:-1;background:linear-gradient(120deg,#2563eb80,#0000 40%,#60a5fa4d);position:absolute;inset:-1px}nav .text{color:#fff;letter-spacing:1px;text-shadow:0 0 15px #60a5fa80;white-space:nowrap;font-size:20px;font-weight:700;position:relative}.user-section{align-items:center;gap:20px;display:flex}.user-info{align-items:center;gap:15px;display:flex}.user-name{color:#fff;white-space:nowrap;font-size:14px;font-weight:600}.user-id{color:#ffffff73;white-space:nowrap;font-size:12px}.logout-btn{color:#fca5a5;cursor:pointer;background:#f8717114;border:1px solid #f8717159;border-radius:10px;padding:9px 16px;font-family:inherit;font-size:12px;font-weight:600;transition:all .2s}.logout-btn:hover{color:#fecaca;background:#f8717129;border-color:#f8717199;transform:translateY(-1px)}.logout-btn:active{transform:translateY(0)}@media (width<=800px){nav{width:calc(100% - 30px);padding:0 20px;left:15px}nav .text{font-size:17px}.user-section{gap:12px}.user-info{gap:8px}.user-name{font-size:12px}.user-id{font-size:10px}.logout-btn{padding:8px 12px}}@media (width<=550px){nav{border-radius:40px;height:62px;padding:0 16px;top:12px}nav .text{font-size:15px}.user-id{display:none}.user-section{gap:10px}.logout-btn{padding:7px 11px;font-size:11px}}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden}body{color:#fff;background:radial-gradient(circle at 15% 20%,#2563eb59,#0000 30%),radial-gradient(circle at 85% 80%,#3b82f640,#0000 30%),linear-gradient(135deg,#06142e,#0b1f3a 50%,#07152d);font-family:Inter,sans-serif}.todo-container{-webkit-backdrop-filter:blur(20px);background:#ffffff12;border:1px solid #ffffff29;border-radius:30px;width:60vw;margin:130px auto 50px;padding:45px;box-shadow:0 20px 60px #00000040,inset 0 1px #ffffff14}.todo-input{gap:12px;display:flex}.todo-input input{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;background:#ffffff14;border:1px solid #ffffff26;border-radius:14px;outline:none;flex:1;padding:15px 20px;font-size:16px;transition:all .25s}.todo-input input::placeholder{color:#ffffff73}.todo-input input:focus{border-color:#3b82f6cc;box-shadow:0 0 0 3px #2563eb26,0 0 20px #2563eb26}.todo-input button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#2563eb,#1d4ed8);border:1px solid #60a5fa66;border-radius:14px;padding:0 25px;font-weight:600;transition:all .25s;box-shadow:0 8px 20px #2563eb40}.todo-input button:hover{transform:translateY(-2px);box-shadow:0 10px 25px #2563eb66}.todo-header{justify-content:space-between;align-items:center;margin:35px 0 18px;display:flex}.todo-header h2{color:#fff;font-size:22px;font-weight:600}.filters{gap:8px;display:flex}.filters button{color:#ffffff8c;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff26;border-radius:20px;width:80px;height:32px;font-weight:600;transition:all .25s}.filters button:hover{color:#fff;background:#2563eb26;border-color:#3b82f680}.filters button.activate{color:#93c5fd;background:#2563eb40;border-color:#3b82f699;box-shadow:0 0 15px #2563eb26}.todo-list{flex-direction:column;gap:10px;max-height:250px;padding-right:8px;display:flex;overflow-y:auto}.todo-item{-webkit-backdrop-filter:blur(12px);background:#ffffff0f;border:1px solid #ffffff1f;border-radius:14px;justify-content:space-between;align-items:center;gap:15px;padding:18px 20px;transition:all .25s;display:flex}.todo-item:hover{background:#ffffff17;border-color:#60a5fa40;transform:translateY(-1px)}.todo-left{color:#fff;align-items:center;gap:12px;min-width:0;display:flex}.todo-left span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.todo-left input[type=checkbox]{accent-color:#2563eb;cursor:pointer;flex-shrink:0;width:18px;height:18px}.todo-left input[type=text]{color:#fff;background:#ffffff14;border:1px solid #60a5fa66;border-radius:8px;outline:none;width:100%;min-width:150px;padding:8px 12px;font-size:14px}.todo-left input[type=text]:focus{border-color:#3b82f6;box-shadow:0 0 10px #2563eb33}.todo-left input[type=text]::placeholder{color:#fff6}.todo-actions{flex-shrink:0;gap:10px;display:flex}.todo-actions button{color:#60a5fa;cursor:pointer;background:0 0;border:none;font-weight:500;transition:all .2s}.todo-actions button:hover{color:#93c5fd;transform:translateY(-1px)}.todo-actions button:last-child{color:#f87171}.todo-actions button:last-child:hover{color:#fca5a5}.todo-item.complete{opacity:.65}.todo-item.complete span{color:#ffffff73;text-decoration:line-through}.no-task{color:#ffffff73;background:#ffffff0d;border:1px dashed #ffffff2e;border-radius:14px;justify-content:center;align-items:center;margin:25px 0;padding:20px;font-size:14px;display:flex}.todo-footer{color:#ffffff73;justify-content:space-between;margin-top:20px;font-size:14px;display:flex}.todo-footer button{color:#60a5fa;cursor:pointer;background:0 0;border:none;transition:all .2s}.todo-footer button:hover{color:#93c5fd}.todo-list::-webkit-scrollbar{width:6px}.todo-list::-webkit-scrollbar-track{background:#ffffff0a;border-radius:10px}.todo-list::-webkit-scrollbar-thumb{background:#60a5fa73;border-radius:10px}.todo-list::-webkit-scrollbar-thumb:hover{background:#60a5fab3}@media (width>=1441px){.todo-container{width:900px;max-width:90vw}nav{width:1000px;left:50%;transform:translate(-50%)}}@media (width<=1440px){.todo-container{width:65vw;padding:40px}nav{width:75vw;left:12.5vw}}@media (width<=1200px){.todo-container{width:70vw;padding:35px}nav{width:80vw;left:10vw}}@media (width<=992px){.todo-container{width:80vw;margin-top:120px;padding:30px}nav{width:85vw;padding:0 30px;left:7.5vw}.todo-header{margin-top:30px}.todo-list{max-height:300px}}@media (width<=768px){nav{width:90vw;height:64px;padding:0 25px;left:5vw}nav .text{font-size:18px}.todo-container{border-radius:24px;width:90vw;margin:105px auto 30px;padding:25px}.todo-input{gap:8px}.todo-input input{padding:13px 15px;font-size:15px}.todo-input button{padding:0 20px}.todo-header{flex-direction:column;align-items:stretch;gap:15px;margin:30px 0 18px}.todo-header h2{font-size:20px}.filters{width:100%}.filters button{flex:1;width:auto}.todo-item{padding:15px}}@media (width<=576px){nav{width:92vw;height:60px;padding:0 20px;top:15px;left:4vw}nav .text{font-size:17px}.todo-container{border-radius:20px;width:92vw;margin:95px auto 25px;padding:20px}.todo-input{flex-direction:column}.todo-input input{width:100%;padding:14px}.todo-input button{width:100%;height:46px;padding:0}.todo-header{gap:12px;margin:25px 0 15px}.todo-header h2{font-size:19px}.filters{gap:6px}.filters button{height:36px;font-size:13px}.todo-list{max-height:300px;padding-right:5px}.todo-item{gap:10px;padding:14px}.todo-left{gap:9px;min-width:0}.todo-left span{font-size:14px}.todo-actions{gap:8px}.todo-actions button{font-size:13px}.todo-footer{align-items:center;gap:10px;font-size:13px}}@media (width<=400px){nav{width:94vw;top:12px;left:3vw}nav .text{font-size:16px}.todo-container{width:94vw;margin-top:90px;padding:16px}.todo-header h2{font-size:18px}.filters{gap:4px}.filters button{height:34px;font-size:12px}.todo-item{padding:12px}.todo-left{gap:7px}.todo-left input[type=checkbox]{width:16px;height:16px}.todo-left span{font-size:13px}.todo-actions{gap:6px}.todo-actions button,.todo-footer{font-size:12px}}@media (width<=320px){nav{height:56px}nav .text{font-size:15px}.todo-container{border-radius:16px;padding:13px}.todo-input input{font-size:14px}.todo-header h2{font-size:17px}.filters button{font-size:11px}.todo-item{padding:10px}.todo-actions{gap:5px}.todo-actions button{font-size:11px}}@media (height<=500px) and (orientation:landscape){nav{height:55px;top:10px}.todo-container{margin-top:80px;padding:20px}.todo-list{max-height:180px}}@media (hover:none) and (pointer:coarse){.todo-input button,.filters button,.todo-actions button,.todo-footer button{min-height:36px}.todo-item:hover,.todo-input button:hover,.todo-actions button:hover{transform:none}}.todo-item,.todo-left,.todo-actions{max-width:100%}.todo-left{overflow:hidden}.todo-left span{min-width:0}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}