body{background:linear-gradient(135deg,#d98c66,#e6c3a3) fixed;min-height:100vh;margin:0;font-family:Arial,sans-serif}.container{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff1f;border-radius:20px;max-width:600px;margin:80px auto;padding:30px;box-shadow:0 10px 30px #0000001a}h1{text-align:center;color:#0f5c63}.input-group{gap:10px;margin:20px 0;display:flex}.input-group input{border:none;border-radius:10px;outline:none;flex:1;padding:12px}.input-group select{border-radius:8px;padding:10px}.input-group button{color:#fff;cursor:pointer;background:#4f9da6;border:none;border-radius:8px;padding:10px 16px}input::placeholder{opacity:.6}input:focus{outline:none;box-shadow:0 0 0 2px #4f9da6}.filters{justify-content:center;gap:10px;margin-bottom:20px;display:flex}.filters button{color:#fff;cursor:pointer;background:#4f9da6;border:none;border-radius:8px;padding:8px 12px}.filters button.active{background:#0f5c63}.task-card{background:#ffffffe6;border-radius:14px;justify-content:space-between;align-items:center;margin-bottom:14px;padding:14px 16px;transition:all .25s;animation:.3s fadeIn;display:flex;box-shadow:0 6px 20px #0000000f}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.task-card:hover{transform:translateY(-3px)scale(1.01)}.task-left{align-items:center;gap:10px;display:flex}.task-actions button{color:#fff;background:#4f9da6}.tag{color:#fff;background:#4f9da6;border-radius:6px;padding:4px 10px;font-size:12px}button{color:#fff;cursor:pointer;background:#4f9da6;border:none;border-radius:10px;padding:8px 14px;transition:all .2s}button:hover{opacity:.85;transform:scale(1.05)}.task-actions button{cursor:pointer;border:none;border-radius:6px;margin-left:5px;padding:6px 10px}.done{opacity:.6;text-decoration:line-through;transition:all .2s}.drag-handle{cursor:grab;opacity:.5;transition:all .2s}.drag-handle:hover{opacity:1}.tag.genel{background:#4f9da6}.tag.iş{background:#f4a261}.tag.kişisel{background:#2a9d8f}.login-container{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);text-align:center;background:#ffffff14;border-radius:20px;max-width:380px;margin:160px auto;padding:40px 30px;box-shadow:0 20px 60px #00000026}.login-header h2{color:#0f5c63;margin:10px 0 5px}.login-header p{opacity:.7;font-size:14px}.avatar{color:#fff;background:linear-gradient(135deg,#4f9da6,#0f5c63);border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;margin:0 auto;font-size:24px;display:flex;box-shadow:0 8px 20px #0003}.login-form{margin-top:25px}.login-form input{background:#ffffffe6;border:none;border-radius:12px;outline:none;width:100%;margin-bottom:15px;padding:12px;transition:all .2s}.login-form input:focus{transform:scale(1.02);box-shadow:0 0 0 2px #4f9da6}.login-form button{cursor:pointer;border:none;border-radius:12px;width:100%;margin-top:10px;padding:12px;font-weight:500}.login-form .primary{color:#fff;background:linear-gradient(135deg,#4f9da6,#0f5c63);transition:all .2s}.login-form .primary:hover{transform:translateY(-2px);box-shadow:0 10px 20px #0003}.login-form .secondary{color:#0f5c63;background:0 0}.login-message{color:#0f5c63;margin-bottom:10px;font-size:13px}.progress-bar{background:#fff3;border-radius:20px;width:100%;height:10px;margin:10px 0;overflow:hidden}.progress-fill{background:#0f5c63;height:100%;transition:all .3s}.progress-text{opacity:.7;font-size:12px}body.dark{color:#f1f1f1;background:linear-gradient(#1e1e1e,#121212)}body.dark .container{background:#ffffff0d}body.dark .task-card{background:#ffffff14}body.dark input,body.dark select{color:#fff;background:#ffffff1a}body.dark button{color:#fff;background:#0f5c63}body.dark .tag{background:#0f5c63}body.dark .login-container{background:#ffffff0d}.top-left{color:#fff;cursor:pointer;z-index:1000;background:#4f9da6;border:none;border-radius:12px;padding:10px 14px;position:fixed;top:20px;left:20px}.top-right{color:#fff;cursor:pointer;z-index:1000;background:#4f9da6;border:none;border-radius:12px;padding:10px 14px;position:fixed;top:20px;right:20px}.top-left:hover,.top-right:hover{transform:translateY(-2px);box-shadow:0 10px 20px #0003}.toast{color:#fff;z-index:9999;background:#4f9da6;border-radius:10px;padding:12px 18px;animation:2s fadeInOut;position:fixed;bottom:30px;right:30px;box-shadow:0 10px 25px #0003}@keyframes fadeInOut{0%{opacity:0;transform:translateY(20px)}10%{opacity:1;transform:translateY(0)}90%{opacity:1}to{opacity:0;transform:translateY(20px)}}
