:root{--task-primary:#8b5cf6;--task-secondary:#ec4899;--task-accent:#f59e0b;--task-status-pending:#6366f1;--task-status-in-progress:#3b82f6;--task-status-completed:#10b981;--task-status-overdue:#ef4444;--task-priority-high:#dc2626;--task-priority-medium:#f59e0b;--task-priority-low:#10b981;--task-bg-start:#0a0118;--task-bg-mid:#1a0a2e;--task-bg-end:#16213e;--glass-bg:#ffffff0d;--glass-border:#ffffff1a;--glass-hover-bg:#ffffff14;--glass-hover-border:#fff3;--text-primary:#fffffff2;--text-secondary:#ffffffb3;--text-muted:#ffffff80}[data-community-color]{--task-primary:var(--community-primary,#8b5cf6)}.tasks-text-primary{color:var(--text-primary)}.tasks-text-secondary{color:var(--text-secondary)}.tasks-text-muted{color:var(--text-muted)}.task-card-modern{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:16px;padding:1.5rem;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.task-card-modern:before{content:"";background:linear-gradient(90deg,var(--task-primary),var(--task-secondary));opacity:0;height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.task-card-modern:hover{background:var(--glass-hover-bg);border-color:var(--glass-hover-border);transform:translateY(-2px);box-shadow:0 12px 48px #00000080}.task-card-modern:hover:before{opacity:1}.task-status-badge{text-transform:uppercase;letter-spacing:.025em;border-radius:999px;align-items:center;gap:.375rem;padding:.375rem .875rem;font-size:.75rem;font-weight:600;transition:all .2s;display:inline-flex}.task-status-pending{color:#a5b4fc;background:linear-gradient(135deg,#6366f133,#6366f11a);border:1px solid #6366f14d;box-shadow:0 0 15px #6366f14d}.task-status-in-progress{color:#93c5fd;background:linear-gradient(135deg,#3b82f633,#3b82f61a);border:1px solid #3b82f64d;animation:2s ease-in-out infinite pulse-glow;box-shadow:0 0 15px #3b82f64d}.task-status-completed{color:#6ee7b7;background:linear-gradient(135deg,#10b98133,#10b9811a);border:1px solid #10b9814d;box-shadow:0 0 15px #10b9814d}.task-status-overdue{color:#fca5a5;background:linear-gradient(135deg,#ef444433,#ef44441a);border:1px solid #ef44444d;animation:1.5s ease-in-out infinite pulse-glow;box-shadow:0 0 15px #ef44444d}@keyframes pulse-glow{0%,to{box-shadow:0 0 15px #3b82f64d}50%{box-shadow:0 0 25px #3b82f680}}.task-priority-badge{text-transform:uppercase;letter-spacing:.025em;border-radius:999px;align-items:center;gap:.375rem;padding:.375rem .875rem;font-size:.75rem;font-weight:600;display:inline-flex}.task-priority-high{color:#fca5a5;background:linear-gradient(135deg,#dc262633,#dc26261a);border:1px solid #dc26264d}.task-priority-medium{color:#fcd34d;background:linear-gradient(135deg,#f59e0b33,#f59e0b1a);border:1px solid #f59e0b4d}.task-priority-low{color:#6ee7b7;background:linear-gradient(135deg,#10b98133,#10b9811a);border:1px solid #10b9814d}.task-button-primary{background:linear-gradient(135deg,var(--task-primary),var(--task-secondary));color:#fff;cursor:pointer;border:none;border-radius:12px;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;position:relative;overflow:hidden}.task-button-primary:before{content:"";opacity:0;background:linear-gradient(135deg,#fff3,#0000);transition:opacity .3s;position:absolute;inset:0}.task-button-primary:hover{transform:translateY(-2px);box-shadow:0 10px 40px #8b5cf680}.task-button-primary:hover:before{opacity:1}.task-button-secondary{color:#fff;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-weight:500;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex}.task-button-secondary:hover{background:#ffffff1a;border-color:#fff3;transform:translateY(-2px)}.task-progress-wrapper{margin:1rem 0;position:relative}.task-progress-label{color:var(--text-secondary);justify-content:space-between;margin-bottom:.5rem;font-size:.875rem;display:flex}.task-progress-container{background:#ffffff0d;border-radius:999px;height:10px;position:relative;overflow:hidden;box-shadow:inset 0 2px 4px #0003}.task-progress-bar{background:linear-gradient(90deg,#8b5cf6,#ec4899,#f59e0b) 0 0/200% 100%;border-radius:999px;height:100%;transition:width .5s cubic-bezier(.4,0,.2,1);animation:3s ease-in-out infinite shimmer;position:relative;box-shadow:0 0 20px #8b5cf699,inset 0 1px #ffffff4d}.task-progress-bar:after{content:"";background:linear-gradient(90deg,#0000,#ffffff4d,#0000);animation:2s ease-in-out infinite slide;position:absolute;inset:0}@keyframes shimmer{0%,to{background-position:0%}50%{background-position:100%}}@keyframes slide{0%{transform:translate(-100%)}to{transform:translate(100%)}}.task-input{color:#fff;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;width:100%;padding:.875rem 1rem;font-size:.938rem;transition:all .3s}.task-input::placeholder{color:#ffffff4d}.task-input:focus{border-color:var(--task-primary);background:#ffffff14;outline:none;box-shadow:0 0 0 3px #8b5cf61a}.task-select{color:#fff;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;width:100%;padding:.875rem 1rem;font-size:.938rem;transition:all .3s}.task-select:focus{border-color:var(--task-primary);background:#ffffff14;outline:none;box-shadow:0 0 0 3px #8b5cf61a}.task-tooltip{color:#fff;white-space:nowrap;opacity:0;pointer-events:none;z-index:1000;background:#000000e6;border-radius:6px;padding:.5rem .75rem;font-size:.75rem;transition:opacity .2s,transform .2s;position:absolute;bottom:100%;left:50%;transform:translate(-50%)translateY(-8px)}.task-tooltip:after{content:"";border:4px solid #0000;border-top-color:#000000e6;position:absolute;top:100%;left:50%;transform:translate(-50%)}:hover>.task-tooltip{opacity:1;transform:translate(-50%)translateY(-12px)}.task-skeleton{background:linear-gradient(90deg,#ffffff0d 0%,#ffffff1a 50%,#ffffff0d 100%) 0 0/200% 100%;border-radius:8px;animation:1.5s ease-in-out infinite skeleton-loading}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}@media (max-width:640px){.task-card-modern{padding:1rem}.task-button-primary,.task-button-secondary{padding:.625rem 1.25rem;font-size:.875rem}}
.safe-area-top{padding-top:env(safe-area-inset-top,0px)}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom,0px)}.safe-area-left{padding-left:env(safe-area-inset-left,0px)}.safe-area-right{padding-right:env(safe-area-inset-right,0px)}.safe-area-x{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.safe-area-y{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}.safe-area-all{padding:env(safe-area-inset-top,0px)env(safe-area-inset-right,0px)env(safe-area-inset-bottom,0px)env(safe-area-inset-left,0px)}.touch-target{min-width:44px;min-height:44px}.touch-target-48{min-width:48px;min-height:48px}.touch-target-56{min-width:56px;min-height:56px}.touch-expand{position:relative}.touch-expand:before{content:"";position:absolute;inset:-8px}.tap-highlight{-webkit-tap-highlight-color:transparent}.active-scale{transition:transform .1s ease-out}.active-scale:active{transform:scale(.95)}.active-scale-sm:active{transform:scale(.98)}.active-opacity{transition:opacity .1s ease-out}.active-opacity:active{opacity:.7}.ripple{position:relative;overflow:hidden}.ripple:after{content:"";opacity:0;background:#ffffff4d;border-radius:50%;width:0;height:0;transition:width .3s ease-out,height .3s ease-out,opacity .3s ease-out;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.ripple:active:after{opacity:1;width:200%;height:200%;transition:width,height,opacity}.momentum-scroll{-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;overflow-y:auto}.momentum-scroll-x{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;overflow-x:auto}.scroll-snap-x{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.scroll-snap-y{scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch}.scroll-snap-item{scroll-snap-align:start}.scroll-snap-center{scroll-snap-align:center}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-thin{scrollbar-width:thin}.scrollbar-thin::-webkit-scrollbar{width:6px;height:6px}.scrollbar-thin::-webkit-scrollbar-track{background:0 0}.scrollbar-thin::-webkit-scrollbar-thumb{background:#0003;border-radius:3px}.pull-to-refresh{overscroll-behavior-y:none}.no-select{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.select-text{-webkit-user-select:text;user-select:text}.break-word{word-break:break-word;overflow-wrap:break-word}.truncate-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.truncate-3{-webkit-line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}@keyframes slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slide-down{0%{transform:translateY(0)}to{transform:translateY(100%)}}.animate-slide-up{animation:.3s cubic-bezier(.32,.72,0,1) forwards slide-up}.animate-slide-down{animation:.3s cubic-bezier(.32,.72,0,1) forwards slide-down}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes scale-in{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes scale-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}.animate-fade-in{animation:.2s ease-out forwards fade-in}.animate-fade-out{animation:.2s ease-out forwards fade-out}.animate-scale-in{animation:.2s cubic-bezier(.34,1.56,.64,1) forwards scale-in}.animate-scale-out{animation:.2s ease-out forwards scale-out}@keyframes spring-in{0%{opacity:0;transform:translateY(20px)scale(.95)}70%{transform:translateY(-5px)scale(1.02)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes spring-out{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(20px)scale(.95)}}@keyframes bounce-in{0%{transform:scale(0)}50%{transform:scale(1.1)}70%{transform:scale(.95)}to{transform:scale(1)}}.animate-spring-in{animation:.5s cubic-bezier(.34,1.56,.64,1) forwards spring-in}.animate-spring-out{animation:.3s ease-out forwards spring-out}.animate-bounce-in{animation:.4s cubic-bezier(.34,1.56,.64,1) forwards bounce-in}@keyframes slide-in-right{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slide-out-right{0%{transform:translate(0)}to{transform:translate(100%)}}@keyframes slide-in-left{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slide-out-left{0%{transform:translate(0)}to{transform:translate(-100%)}}.animate-slide-in-right{animation:.3s cubic-bezier(.32,.72,0,1) forwards slide-in-right}.animate-slide-out-right{animation:.3s cubic-bezier(.32,.72,0,1) forwards slide-out-right}.animate-slide-in-left{animation:.3s cubic-bezier(.32,.72,0,1) forwards slide-in-left}.animate-slide-out-left{animation:.3s cubic-bezier(.32,.72,0,1) forwards slide-out-left}.mobile-bottom-nav{z-index:50;-webkit-backdrop-filter:blur(12px);padding-bottom:env(safe-area-inset-bottom,0px);background:#fffffff2;border-top:1px solid #0000001a;position:fixed;bottom:0;left:0;right:0}.mobile-bottom-nav-item{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:4px;min-width:64px;height:64px;transition:all .2s;display:flex}.mobile-bottom-nav-item:active{transform:scale(.9)}.mobile-bottom-nav-indicator{border-radius:4px 4px 0 0;width:48px;height:4px;transition:all .3s cubic-bezier(.34,1.56,.64,1);position:absolute;bottom:0}.mobile-header{z-index:40;-webkit-backdrop-filter:blur(12px);padding-top:env(safe-area-inset-top,0px);background:#fffffff2;border-bottom:1px solid #0000001a;position:sticky;top:0}.mobile-header-content{justify-content:space-between;align-items:center;height:56px;padding:0 16px;display:flex}.drag-handle{background:#0003;border-radius:3px;width:48px;height:6px;margin:12px auto}.drag-handle-light{background:#ffffff4d}.fab{z-index:30;border-radius:16px;justify-content:center;align-items:center;width:56px;height:56px;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex;position:fixed;bottom:80px;right:16px;box-shadow:0 4px 12px #00000026,0 2px 4px #0000001a}.fab:active{transform:scale(.9)}.fab:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0003,0 4px 8px #0000001a}[dir=rtl] .fab{left:16px;right:auto}.mobile-card{background:#fff;border:1px solid #00000014;border-radius:16px;transition:all .2s;box-shadow:0 1px 3px #0000000d}.mobile-card:active{background:#00000005}.mobile-card-elevated{box-shadow:0 4px 12px #0000001a}.horizontal-scroll{-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;gap:12px;padding:4px;display:flex;overflow-x:auto}.horizontal-scroll::-webkit-scrollbar{display:none}.horizontal-scroll>*{scroll-snap-align:start;flex-shrink:0}.mobile-only{display:block}.desktop-only{display:none}@media (min-width:1024px){.mobile-only{display:none}.desktop-only{display:block}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.animate-slide-up,.animate-slide-down,.animate-fade-in,.animate-fade-out,.animate-scale-in,.animate-scale-out,.animate-spring-in,.animate-spring-out,.animate-bounce-in{opacity:1!important;animation:none!important;transform:none!important}}@keyframes skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%) 0 0/200% 100%;border-radius:8px;animation:1.5s ease-in-out infinite skeleton-shimmer}.skeleton-text{height:16px;margin-bottom:8px}.skeleton-title{width:60%;height:24px;margin-bottom:12px}.skeleton-avatar{border-radius:50%;width:48px;height:48px}.skeleton-card{border-radius:16px;height:120px}.mobile-input{background:#fff;border:2px solid #e5e7eb;border-radius:12px;width:100%;padding:14px 16px;font-size:16px;transition:all .2s}.mobile-input:focus{border-color:var(--primary-color,#3b82f6);outline:none;box-shadow:0 0 0 3px #3b82f61a}.mobile-input::placeholder{color:#9ca3af}.content-with-bottom-nav{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px) + 16px)}.content-with-fab{padding-bottom:calc(64px + 56px + 32px + env(safe-area-inset-bottom,0px))}.swipe-container{position:relative;overflow:hidden}.swipe-content{transition:transform .2s}.swipe-actions{align-items:stretch;display:flex;position:absolute;top:0;bottom:0}.swipe-actions-left{left:0;transform:translate(-100%)}.swipe-actions-right{right:0;transform:translate(100%)}.swipe-action-btn{color:#fff;justify-content:center;align-items:center;padding:0 24px;font-weight:600;display:flex}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:48px 24px;display:flex}.empty-state-icon{color:#9ca3af;width:80px;height:80px;margin-bottom:16px}.empty-state-title{color:#374151;margin-bottom:8px;font-size:18px;font-weight:600}.empty-state-description{color:#6b7280;max-width:280px;font-size:14px}