*{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary:#fff;--bg-secondary:#f8fafc;--bg-tertiary:#e2e8f0;--bg-tooltip:#1e293b;--text-primary:#1e293b;--text-secondary:#64748b;--text-tertiary:#94a3b8;--primary:#3b82f6;--primary-dark:#2563eb;--accent:#3b82f6;--accent-hover:#2563eb;--success:#10b981;--error:#ef4444;--warning:#f59e0b;--border:#e2e8f0;--shadow:#0000001a;--shadow-sm:#0000000d;--shadow-md:#0000001a;--shadow-lg:#00000026}[data-theme=dark]{--bg-primary:#0f172a;--bg-secondary:#1e293b;--bg-tertiary:#334155;--bg-tooltip:#f1f5f9;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-tertiary:#64748b;--primary:#60a5fa;--primary-dark:#3b82f6;--accent:#60a5fa;--accent-hover:#3b82f6;--success:#34d399;--error:#f87171;--warning:#fbbf24;--border:#334155;--shadow:#0000004d;--shadow-sm:#0003;--shadow-md:#0000004d;--shadow-lg:#0006}[data-theme=minimal]{--bg-primary:#fff;--bg-secondary:#f9f9f9;--bg-tertiary:#f0f0f0;--bg-tooltip:#1a1a1a;--text-primary:#1a1a1a;--text-secondary:#666;--text-tertiary:#999;--primary:#2d2d2d;--primary-dark:#1a1a1a;--accent:#2d2d2d;--accent-hover:#1a1a1a;--success:#16a34a;--error:#dc2626;--warning:#ea580c;--border:#e6e6e6;--shadow:#00000008;--shadow-sm:#00000005;--shadow-md:#00000008;--shadow-lg:#00000014}[data-theme=ocean]{--bg-primary:#f0f9ff;--bg-secondary:#e0f2fe;--bg-tertiary:#bae6fd;--bg-tooltip:#0c4a6e;--text-primary:#0c4a6e;--text-secondary:#0369a1;--text-tertiary:#0284c7;--primary:#0ea5e9;--primary-dark:#0284c7;--accent:#0ea5e9;--accent-hover:#0284c7;--success:#059669;--error:#dc2626;--warning:#d97706;--border:#7dd3fc;--shadow:#0ea5e926;--shadow-sm:#0ea5e91a;--shadow-md:#0ea5e926;--shadow-lg:#0ea5e940}[data-theme=forest]{--bg-primary:#f0fdf4;--bg-secondary:#dcfce7;--bg-tertiary:#bbf7d0;--bg-tooltip:#14532d;--text-primary:#14532d;--text-secondary:#166534;--text-tertiary:#15803d;--primary:#16a34a;--primary-dark:#15803d;--accent:#16a34a;--accent-hover:#15803d;--success:#059669;--error:#dc2626;--warning:#d97706;--border:#86efac;--shadow:#22c55e26;--shadow-sm:#22c55e1a;--shadow-md:#22c55e26;--shadow-lg:#22c55e40}[data-theme=sunset]{--bg-primary:#fef7ed;--bg-secondary:#fed7aa;--bg-tertiary:#fdba74;--bg-tooltip:#9a3412;--text-primary:#9a3412;--text-secondary:#c2410c;--text-tertiary:#dc2626;--primary:#ea580c;--primary-dark:#dc2626;--accent:#ea580c;--accent-hover:#dc2626;--success:#16a34a;--error:#dc2626;--warning:#d97706;--border:#fed7aa;--shadow:#ea580c26;--shadow-sm:#ea580c1a;--shadow-md:#ea580c26;--shadow-lg:#ea580c40}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#fff;background-color:var(--bg-primary);color:#1e293b;color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;min-height:100vh;transition:all .3s ease}.app,.auth-form,.header,.sidebar,.todo-form,.todo-item,button,input,select,textarea{transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f8fafc;background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:#e2e8f0;background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#64748b;background:var(--text-secondary)}button,input,textarea{font-family:inherit}button:focus,input:focus,textarea:focus{outline:2px solid #3b82f6;outline:2px solid var(--accent);outline-offset:2px}.fade-in{animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.slide-up{animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.homepage{background:linear-gradient(135deg,var(--bg-primary) 0,var(--bg-secondary) 100%);min-height:100vh;overflow-x:hidden}.hero-section{align-items:center;display:flex;gap:60px;margin:0 auto;max-width:1200px;min-height:100vh;padding:80px 24px 40px}.hero-content{flex:1 1;max-width:600px}.hero-badge{align-items:center;background:var(--bg-secondary);border:1px solid var(--border);border-radius:50px;color:var(--text-secondary);display:inline-flex;font-size:14px;font-weight:500;gap:8px;margin-bottom:24px;padding:8px 16px}.hero-title{color:var(--text-primary);font-size:clamp(2.5rem,5vw,3.5rem);font-weight:800;line-height:1.1;margin-bottom:24px}.hero-title-accent{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,var(--primary) 0,var(--accent) 100%);-webkit-background-clip:text;background-clip:text}.hero-description{color:var(--text-secondary);font-size:1.25rem;line-height:1.6;margin-bottom:32px;max-width:540px}.hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:48px}.cta-button{align-items:center;border:none;border-radius:12px;cursor:pointer;display:inline-flex;font-size:16px;font-weight:600;gap:8px;padding:14px 24px;text-decoration:none;transition:all .2s ease}.cta-button.primary{background:linear-gradient(135deg,var(--primary) 0,var(--accent) 100%);box-shadow:0 4px 14px var(--shadow-md);color:#fff}.cta-button.primary:hover{box-shadow:0 8px 25px var(--shadow-lg);transform:translateY(-2px)}.cta-button.secondary{background:var(--bg-primary);border:2px solid var(--border);color:var(--text-primary)}.cta-button.secondary:hover{background:var(--bg-secondary);border-color:var(--accent)}.cta-button.large{font-size:18px;padding:16px 32px}.hero-stats{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.stat-item{align-items:center;background:var(--bg-primary);border-radius:12px;box-shadow:0 2px 8px var(--shadow-sm);display:flex;gap:12px;padding:16px}.stat-icon{color:var(--primary)}.stat-number{color:var(--text-primary);font-size:1.5rem;font-weight:700;line-height:1}.stat-label{font-size:.875rem;line-height:1}.theme-preview-notice{margin-top:24px}.theme-notice-content{align-items:center;animation:pulse 2s ease-in-out infinite;background:var(--bg-secondary);border:1px solid var(--border);border-radius:50px;color:var(--text-secondary);display:flex;font-size:14px;font-weight:500;gap:8px;justify-content:center;padding:12px 20px}.theme-notice-icon{color:var(--primary);flex-shrink:0}@keyframes pulse{0%,to{opacity:.8;transform:scale(1)}50%{opacity:1;transform:scale(1.02)}}.hero-visual{align-items:center;display:flex;flex:1 1;justify-content:center}.app-preview{background:var(--bg-primary);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 40px var(--shadow-lg);max-width:100%;overflow:hidden;width:480px}.preview-header{align-items:center;background:var(--bg-secondary);border-bottom:1px solid var(--border);display:flex;gap:12px;padding:12px 16px}.preview-dots{display:flex;gap:6px}.dot{border-radius:50%;height:8px;width:8px}.dot.red{background:#ff5f57}.dot.yellow{background:#ffbd2e}.dot.green{background:#28ca42}.preview-title{color:var(--text-primary);font-size:14px;font-weight:600}.preview-content{display:flex;height:300px}.preview-sidebar{background:var(--bg-secondary);border-right:1px solid var(--border);padding:16px 12px;width:160px}.preview-nav-item{align-items:center;border-radius:6px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:13px;gap:8px;margin-bottom:4px;padding:8px 12px}.preview-nav-item.active{background:var(--primary);color:#fff}.preview-main{flex:1 1;padding:16px}.preview-todo{align-items:center;background:var(--bg-primary);border:1px solid var(--border);border-radius:8px;display:flex;gap:12px;margin-bottom:8px;padding:12px}.preview-todo.completed{opacity:.6}.preview-todo.completed span{text-decoration:line-through}.todo-check{color:var(--success)}.todo-check-empty{border:2px solid var(--border);border-radius:3px;height:16px;width:16px}.todo-priority{border-radius:50%;height:8px;margin-left:auto;width:8px}.todo-priority.high{background:var(--error)}.todo-priority.medium{background:var(--warning)}.section-content{margin:0 auto;max-width:1200px;padding:80px 24px}.section-header{margin-bottom:60px;text-align:center}.section-title{color:var(--text-primary);font-size:2.5rem;font-weight:700;margin-bottom:16px}.section-description{color:var(--text-secondary);font-size:1.25rem;margin:0 auto;max-width:600px}.features-section{background:var(--bg-primary)}.features-grid{grid-gap:32px;gap:32px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.feature-card{background:var(--bg-primary);border-radius:16px;box-shadow:0 4px 16px var(--shadow-sm);padding:32px 24px;text-align:center;transition:all .3s ease}.feature-card:hover{box-shadow:0 8px 32px var(--shadow-md)}.feature-icon{align-items:center;background:var(--bg-secondary);border-radius:16px;display:inline-flex;height:64px;justify-content:center;margin-bottom:24px;width:64px}.feature-title{color:var(--text-primary);font-size:1.25rem;font-weight:600;margin-bottom:12px}.feature-description{color:var(--text-secondary);line-height:1.6}.themes-section{background:var(--bg-secondary)}.themes-showcase{grid-gap:32px;display:grid;gap:32px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:0 auto;max-width:900px}.theme-preview{border-radius:16px;box-shadow:0 8px 32px var(--shadow-md);overflow:hidden;transition:transform .3s ease}.theme-preview:hover{transform:translateY(-4px)}.theme-header{align-items:center;display:flex;font-size:14px;font-weight:500;justify-content:space-between;padding:12px 16px}.theme-dots{display:flex;gap:6px}.theme-dots span{border-radius:50%;height:8px;width:8px}.theme-content{display:flex;height:120px}.theme-sidebar{border-radius:0 0 0 4px;width:60px}.theme-main{display:flex;flex:1 1;flex-direction:column;gap:8px;padding:12px}.theme-todo{border-radius:4px;height:12px}.theme-preview.light .theme-header{background:#fff;color:#1e293b}.theme-preview.light .theme-dots span:first-child{background:#ff5f57}.theme-preview.light .theme-dots span:nth-child(2){background:#ffbd2e}.theme-preview.light .theme-dots span:nth-child(3){background:#28ca42}.theme-preview.light .theme-content{background:#f8fafc}.theme-preview.light .theme-sidebar{background:#e2e8f0}.theme-preview.light .theme-todo{background:#fff;border:1px solid #e2e8f0}.theme-preview.dark .theme-header{background:#1e293b;color:#f1f5f9}.theme-preview.dark .theme-dots span:first-child{background:#ff5f57}.theme-preview.dark .theme-dots span:nth-child(2){background:#ffbd2e}.theme-preview.dark .theme-dots span:nth-child(3){background:#28ca42}.theme-preview.dark .theme-content{background:#0f172a}.theme-preview.dark .theme-sidebar{background:#334155}.theme-preview.dark .theme-todo{background:#1e293b;border:1px solid #334155}.theme-preview.ocean .theme-header{background:#e0f2fe;color:#0c4a6e}.theme-preview.ocean .theme-dots span:first-child{background:#ff5f57}.theme-preview.ocean .theme-dots span:nth-child(2){background:#ffbd2e}.theme-preview.ocean .theme-dots span:nth-child(3){background:#28ca42}.theme-preview.ocean .theme-content{background:#f0f9ff}.theme-preview.ocean .theme-sidebar{background:#bae6fd}.theme-preview.ocean .theme-todo{background:#e0f2fe;border:1px solid #7dd3fc}.themes-cta{margin-top:48px;text-align:center}.themes-cta-content{margin:0 auto;max-width:600px}.themes-cta-text{align-items:center;background:var(--bg-primary);border:2px solid var(--primary);border-radius:16px;box-shadow:0 4px 16px var(--shadow-sm);color:var(--text-primary);display:flex;font-size:16px;font-weight:500;gap:12px;justify-content:center;margin:0;overflow:hidden;padding:20px 24px;position:relative}.themes-cta-text:before{animation:shimmer 3s ease-in-out infinite;background:linear-gradient(90deg,#0000,var(--bg-secondary),#0000);content:"";height:100%;left:-100%;position:absolute;top:0;width:100%}.themes-cta-text svg{color:var(--primary);flex-shrink:0}@keyframes shimmer{0%{left:-100%}50%{left:100%}to{left:100%}}.cta-section{background:linear-gradient(135deg,var(--primary) 0,var(--accent) 100%);color:#fff}.cta-content{text-align:center}.cta-title{font-size:2.5rem;font-weight:700;margin-bottom:16px}.cta-description{font-size:1.25rem;margin-left:auto;margin-right:auto;max-width:600px;opacity:.9}.cta-actions,.cta-description{margin-bottom:32px}.cta-section .cta-button.primary{background:#fff;color:var(--primary)}.cta-section .cta-button.primary:hover{background:var(--bg-secondary)}.cta-features{display:flex;flex-wrap:wrap;gap:32px;justify-content:center}.cta-feature{align-items:center;display:flex;font-weight:500;gap:8px;opacity:.9}.homepage-footer{background:var(--bg-primary);border-top:1px solid var(--border);padding:40px 24px}.footer-content{align-items:center;display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;margin:0 auto;max-width:1200px}.footer-brand h3{color:var(--text-primary);font-size:1.5rem;font-weight:700;margin-bottom:8px}.footer-brand p{color:var(--text-secondary)}.footer-features{display:flex;flex-wrap:wrap;gap:24px}.footer-feature{align-items:center;color:var(--text-secondary);display:flex;font-size:14px;gap:6px}@media (max-width:768px){.hero-section{flex-direction:column;gap:40px;padding:60px 24px 40px;text-align:center}.hero-content{max-width:none}.hero-actions{justify-content:center}.cta-button{font-size:14px;padding:12px 20px}.hero-stats{grid-template-columns:repeat(2,1fr)}.app-preview{max-width:400px;width:100%}.section-content{padding:60px 24px}.section-title{font-size:2rem}.features-grid,.themes-showcase{gap:24px;grid-template-columns:1fr}.cta-title{font-size:2rem}.cta-features{flex-direction:column;gap:16px}.footer-content{flex-direction:column;text-align:center}.footer-features{justify-content:center}.theme-notice-content{flex-direction:column;font-size:13px;gap:6px;padding:10px 16px;text-align:center}.themes-cta-text{flex-direction:column;font-size:14px;gap:8px;padding:16px 20px}}@media (max-width:480px){.hero-stats{grid-template-columns:1fr}.stat-item{padding:12px}.preview-content{height:200px}.preview-sidebar{width:120px}.theme-notice-content{font-size:12px;padding:8px 12px}.themes-cta-text{font-size:13px;padding:12px 16px}}[data-theme=dark] .hero-section{background:linear-gradient(135deg,var(--bg-primary) 0,var(--bg-secondary) 100%)}[data-theme=dark] .hero-title-accent{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,var(--primary) 0,var(--accent) 100%);-webkit-background-clip:text;background-clip:text}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.app-preview{animation:float 6s ease-in-out infinite}.feature-card,.theme-preview{transition:all .3s cubic-bezier(.4,0,.2,1)}.auth-container{align-items:center;background:linear-gradient(135deg,var(--bg-primary) 0,var(--bg-secondary) 100%);display:flex;justify-content:center;min-height:100vh;padding:20px}.auth-form{background:var(--bg-primary);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 40px var(--shadow-lg);max-width:400px;padding:40px;width:100%}.auth-header{margin-bottom:32px;padding-top:0;position:relative;text-align:center}.back-button{align-items:center;background:none;border:none;border-radius:8px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:6px;left:-12px;line-height:1;padding:8px 12px;position:absolute;top:-4px;transition:all .2s ease;z-index:10}.back-button:hover{background:var(--bg-secondary);color:var(--text-primary);transform:translateX(-2px)}.auth-header h1{color:var(--text-primary);font-size:28px;font-weight:700;line-height:1.2;margin-bottom:8px}.auth-header p{color:var(--text-secondary);font-size:16px}.auth-form-content{display:flex;flex-direction:column;gap:20px}.form-group input{background:var(--bg-secondary);border:2px solid var(--border);border-radius:8px;color:var(--text-primary);font-size:16px;padding:12px 16px;transition:all .2s ease}.form-group input:focus{background:var(--bg-primary);border-color:var(--accent)}.form-group input.error{border-color:var(--error)}.password-input{position:relative}.password-toggle{background:none;border:none;border-radius:4px;color:var(--text-secondary);cursor:pointer;padding:4px;position:absolute;right:12px;top:50%;transform:translateY(-50%);transition:color .2s ease}.password-toggle:hover{color:var(--text-primary)}.error-message{font-size:14px}.submit-error{background:#ef44441a;border:1px solid var(--error);border-radius:8px;padding:12px;text-align:center}.submit-button{align-items:center;border-radius:8px;display:flex;font-size:16px;font-weight:600;justify-content:center;min-height:48px;padding:14px 24px}.submit-button:disabled{cursor:not-allowed;opacity:.7}.loading-spinner{border:2px solid #ffffff4d;border-top-color:#fff;height:20px;width:20px}.auth-switch{margin-top:16px;text-align:center}.auth-switch p{color:var(--text-secondary);font-size:14px}.switch-button{background:none;border:none;color:var(--accent);cursor:pointer;font-size:14px;font-weight:600;padding:0;text-decoration:underline}.switch-button:hover{color:var(--accent-hover)}@media (max-width:480px){.auth-container{padding:10px}.auth-form{padding:24px}.auth-header h1{font-size:24px}.back-button{font-size:13px;left:-8px;padding:6px 8px;top:-2px}.back-button svg{height:18px;width:18px}.form-group input{font-size:16px}}.header{background:var(--bg-primary);border-bottom:1px solid var(--border);box-shadow:0 2px 4px var(--shadow);justify-content:space-between;padding:16px 24px;position:-webkit-sticky;position:sticky;top:0;z-index:100}.header,.header-left{align-items:center;display:flex}.header-left{gap:16px}.menu-button{background:none;border:none;border-radius:6px;color:var(--text-primary);cursor:pointer;padding:8px;transition:all .2s ease}.menu-button:hover{background:var(--bg-secondary)}.brand h1{color:var(--text-primary);font-size:20px;font-weight:700;margin:0}.header-center{flex:1 1;margin:0 24px;max-width:400px}.search-container{position:relative;width:100%}.search-icon{color:var(--text-secondary);left:12px;position:absolute;top:50%;transform:translateY(-50%)}.search-input{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);font-size:14px;padding:10px 12px 10px 40px;transition:all .2s ease;width:100%}.search-input:focus{background:var(--bg-primary);border-color:var(--accent)}.header-right{gap:12px}.bulk-actions,.header-right{align-items:center;display:flex}.bulk-actions{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;gap:8px;padding:8px 12px}.selection-count{color:var(--text-secondary);font-size:12px;font-weight:500}.bulk-action-btn{background:none;border:none;border-radius:4px;color:var(--text-secondary);cursor:pointer;padding:4px;transition:all .2s ease}.bulk-action-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.bulk-action-btn.danger:hover{background:#ef44441a;color:var(--error)}.header-controls{align-items:center;display:flex;gap:8px}.view-toggle{background:none;border:none;border-radius:6px;color:var(--text-secondary);cursor:pointer;padding:8px;transition:all .2s ease}.view-toggle.active,.view-toggle:hover{background:var(--bg-secondary);color:var(--accent)}.sort-dropdown{position:relative}.sort-button{background:none;border:none;border-radius:6px;color:var(--text-secondary);cursor:pointer;padding:8px;transition:all .2s ease}.sort-button:hover{background:var(--bg-secondary);color:var(--text-primary)}.sort-menu{background:var(--bg-primary);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px var(--shadow-lg);margin-top:4px;min-width:160px;position:absolute;right:0;top:100%;z-index:200}.sort-option{align-items:center;background:none;border:none;color:var(--text-primary);cursor:pointer;display:flex;justify-content:space-between;padding:12px 16px;text-align:left;transition:all .2s ease;width:100%}.sort-option.active,.sort-option:hover{background:var(--bg-secondary)}.sort-option.active{color:var(--accent)}.sort-indicator{font-weight:700}.help-button-header{align-items:center;background:none;border:1px solid var(--border);border-radius:8px;color:var(--text-secondary);cursor:pointer;display:flex;justify-content:center;padding:8px;transition:all .2s ease}.help-button-header:hover{background:var(--bg-secondary);border-color:var(--accent);color:var(--text-primary)}.create-button{align-items:center;background:var(--accent);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:6px;padding:8px 16px;transition:all .2s ease}.create-button:hover{background:var(--accent-hover);transform:translateY(-1px)}.user-menu{position:relative}.user-button{background:none;border:none;cursor:pointer;padding:2px}.user-avatar{font-size:12px;transition:all .2s ease}.user-avatar,.user-avatar-image{height:32px;width:32px}.user-button:hover .user-avatar,.user-button:hover .user-avatar-image{transform:scale(1.1)}.user-dropdown{background:var(--bg-primary);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px var(--shadow-lg);margin-top:8px;min-width:200px;padding:8px 0;position:absolute;right:0;top:100%;z-index:200}.user-info{padding:12px 16px}.user-name{color:var(--text-primary);font-size:14px;font-weight:600}.user-email{margin-top:2px}.user-dropdown hr{border:none;border-top:1px solid var(--border);margin:8px 0}.dropdown-item{align-items:center;background:none;border:none;color:var(--text-primary);cursor:pointer;display:flex;font-size:14px;gap:8px;padding:10px 16px;text-align:left;transition:all .2s ease;width:100%}.dropdown-item:hover{background:var(--bg-secondary)}.dropdown-item.danger{color:var(--error)}.dropdown-item.danger:hover{background:#ef44441a}.overlay{bottom:0;left:0;position:fixed;right:0;top:0;z-index:150}@media (max-width:768px){.header{padding:12px 16px}.header-center{margin:0 16px}.brand h1{font-size:18px}.bulk-actions .selection-count,.create-button span{display:none}}@media (max-width:480px){.header{padding:8px 12px}.header-center{margin:0 8px}.search-input{font-size:16px}.sort-button,.view-toggle{padding:6px}}.todo-form-overlay{align-items:center;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}.todo-form{background:var(--bg-primary);border:1px solid var(--border);border-radius:12px;box-shadow:0 24px 48px var(--shadow-lg);max-height:90vh;max-width:600px;overflow-y:auto;width:100%}.form-header{align-items:center;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:20px 24px}.form-header h2{color:var(--text-primary);font-size:20px;font-weight:600;margin:0}.close-button:hover{background:var(--bg-secondary)}.form-content{gap:20px;padding:24px}.form-content,.form-group{display:flex;flex-direction:column}.form-group{gap:8px}.form-group label{align-items:center;color:var(--text-primary);display:flex;font-size:14px;font-weight:500;gap:8px}.form-group input,.form-group select,.form-group textarea{background:var(--bg-secondary);border:2px solid var(--border);border-radius:8px;color:var(--text-primary);font-family:inherit;font-size:14px;padding:12px 16px;transition:all .2s ease}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{background:var(--bg-primary);border-color:var(--accent)}.form-group input.error,.form-group select.error,.form-group textarea.error{border-color:var(--error)}.form-group textarea{min-height:80px;resize:vertical}.form-row{grid-gap:16px;display:grid;gap:16px;grid-template-columns:1fr 1fr}.error-message{color:var(--error);font-size:12px;margin-top:4px}.tags-container{display:flex;flex-direction:column;gap:12px}.tags-list{display:flex;flex-wrap:wrap;gap:8px}.tag{align-items:center;border-radius:16px;display:flex;font-size:12px;gap:6px;padding:4px 8px}.tag-remove{background:none;border:none;border-radius:50%;color:#fffc;cursor:pointer;padding:2px;transition:all .2s ease}.tag-remove:hover{background:#fff3;color:#fff}.tag-input{display:flex;gap:8px}.tag-input input{flex:1 1}.add-tag-button{align-items:center;background:var(--accent);border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;padding:8px 12px;transition:all .2s ease}.add-tag-button:hover:not(:disabled){background:var(--accent-hover)}.add-tag-button:disabled{cursor:not-allowed;opacity:.5}.suggested-tags{align-items:center;display:flex;flex-wrap:wrap;gap:6px}.suggested-label{color:var(--text-secondary);font-size:12px;font-weight:500}.suggested-tag{background:var(--bg-tertiary);border:none;border-radius:12px;color:var(--text-secondary);cursor:pointer;font-size:11px;padding:4px 8px;transition:all .2s ease}.suggested-tag:hover{background:var(--accent);color:#fff}.subtasks-container{display:flex;flex-direction:column;gap:8px}.subtask-item{align-items:center;background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;display:flex;justify-content:space-between;padding:8px 12px}.subtask-remove{background:none;border:none;border-radius:4px;color:var(--text-secondary);cursor:pointer;padding:4px;transition:all .2s ease}.subtask-remove:hover{background:#ef44441a;color:var(--error)}.subtask-input{display:flex;gap:8px}.subtask-input input{flex:1 1}.add-subtask-button{align-items:center;background:var(--bg-tertiary);border:none;border-radius:6px;color:var(--text-primary);cursor:pointer;display:flex;padding:8px 12px;transition:all .2s ease}.add-subtask-button:hover:not(:disabled){background:var(--accent);color:#fff}.add-subtask-button:disabled{cursor:not-allowed;opacity:.5}.form-actions{border-top:1px solid var(--border);display:flex;gap:12px;justify-content:flex-end;margin-top:16px;padding-top:16px}.cancel-button{background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);cursor:pointer;font-weight:500;padding:10px 20px;transition:all .2s ease}.cancel-button:hover{background:var(--bg-tertiary)}.submit-button{background:var(--accent);border:none;border-radius:6px;color:#fff;cursor:pointer;font-weight:500;padding:10px 20px;transition:all .2s ease}.submit-button:hover{background:var(--accent-hover)}@media (max-width:768px){.todo-form-overlay{padding:10px}.todo-form{max-height:95vh}.form-content{padding:20px}.form-row{grid-template-columns:1fr}.form-actions{flex-direction:column-reverse}.form-actions button{width:100%}}@media (max-width:480px){.form-header{padding:16px 20px}.form-content{padding:16px}.tags-list{gap:6px}.tag{font-size:11px;padding:3px 6px}}.ai-processing{align-items:center;background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;color:var(--text-secondary);display:flex;font-size:14px;gap:8px;margin-top:8px;padding:8px 12px}.ai-processing .spinning{animation:spin 1s linear infinite;color:var(--primary)}.ai-suggestions{background:linear-gradient(135deg,var(--bg-secondary) 0,var(--bg-primary) 100%);border:2px solid var(--primary);border-radius:8px;box-shadow:0 4px 12px var(--shadow-md);margin-top:12px;padding:16px}.ai-suggestions-header{align-items:center;color:var(--primary);display:flex;font-size:14px;font-weight:600;gap:8px;margin-bottom:12px}.ai-suggestions-header svg{color:var(--primary)}.ai-suggestions-content{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.ai-suggestion-item{align-items:center;background:var(--bg-primary);border:1px solid var(--border);border-radius:4px;color:var(--text-secondary);display:flex;font-size:13px;gap:8px;padding:6px 8px}.ai-suggestion-item svg{color:var(--primary);flex-shrink:0}.ai-suggestions-actions{display:flex;gap:8px;justify-content:flex-end}.ai-apply-button,.ai-dismiss-button{border:1px solid;border-radius:4px;cursor:pointer;font-size:12px;font-weight:500;padding:6px 12px;transition:all .2s ease}.ai-apply-button{background:var(--primary);border-color:var(--primary);color:#fff}.ai-apply-button:hover{background:var(--primary-dark);border-color:var(--primary-dark)}.ai-dismiss-button{background:#0000;border-color:var(--border);color:var(--text-secondary)}.ai-dismiss-button:hover{background:var(--bg-secondary);color:var(--text-primary)}.todo-item{background:var(--bg-primary);border:2px solid var(--border);border-radius:12px;cursor:pointer;overflow:hidden;padding:16px;position:relative;transition:all .2s ease}.todo-item:hover{border-color:var(--accent);box-shadow:0 4px 12px var(--shadow)}.todo-item.selected{background:#3b82f60d;border-color:var(--accent)}.todo-item.completed{opacity:.7}.todo-item.completed .todo-title{color:var(--text-secondary);text-decoration:line-through}.todo-item-header{align-items:flex-start;display:flex;gap:12px}.complete-button{align-items:center;background:none;border:2px solid var(--border);border-radius:50%;color:var(--text-secondary);cursor:pointer;display:flex;flex-shrink:0;height:24px;justify-content:center;margin-top:2px;transition:all .2s ease;width:24px}.complete-button:hover{border-color:var(--success);color:var(--success)}.complete-button.completed{background:var(--success);border-color:var(--success);color:#fff}.todo-content{flex:1 1;min-width:0}.todo-title{word-wrap:break-word;color:var(--text-primary);font-size:16px;font-weight:600;line-height:1.4;margin:0 0 8px}.todo-description{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;color:var(--text-secondary);display:-webkit-box;font-size:14px;line-height:1.5;margin:0 0 12px;overflow:hidden}.todo-metadata{display:flex;flex-direction:column;gap:8px}.metadata-row{align-items:center;display:flex;flex-wrap:wrap;gap:12px}.category,.due-date,.priority{align-items:center;display:flex;font-size:12px;font-weight:500;gap:4px}.category{background:var(--bg-secondary);border-radius:12px;color:var(--text-secondary);padding:2px 8px;text-transform:capitalize}.tags{align-items:center;display:flex;flex-wrap:wrap;gap:6px}.tags svg{color:var(--text-secondary)}.tag{background:var(--accent);border-radius:8px;color:#fff;padding:2px 6px}.tag,.tag-count{font-size:10px;font-weight:500}.tag-count{color:var(--text-secondary)}.subtasks-summary{margin-top:4px}.expand-button{align-items:center;background:none;border:none;color:var(--text-secondary);cursor:pointer;display:flex;font-size:12px;gap:4px;padding:4px 0;transition:color .2s ease}.expand-button:hover{color:var(--text-primary)}.subtasks-list{border-left:2px solid var(--border);margin-top:8px;padding-left:8px}.subtask{align-items:center;display:flex;font-size:12px;gap:8px;padding:4px 0}.subtask.completed .subtask-text{color:var(--text-secondary);text-decoration:line-through}.subtask-bullet{color:var(--text-secondary);flex-shrink:0}.subtask-text{color:var(--text-primary);line-height:1.4}.todo-actions{display:flex;flex-direction:column;gap:4px;opacity:0;transition:opacity .2s ease}.todo-item:hover .todo-actions{opacity:1}.action-button{align-items:center;background:none;border:none;border-radius:6px;color:var(--text-secondary);cursor:pointer;display:flex;height:28px;justify-content:center;transition:all .2s ease;width:28px}.action-button:hover{background:var(--bg-secondary);color:var(--text-primary)}.action-button.duplicate:hover{background:#3b82f61a;color:var(--primary-color)}.action-button.delete:hover{background:#ef44441a;color:var(--error)}.todo-footer{align-items:center;border-top:1px solid var(--border);color:var(--text-secondary);display:flex;font-size:11px;justify-content:space-between;margin-top:12px;padding-top:8px}.completed-date,.created-date{align-items:center;display:flex;gap:4px}.selection-indicator{background:var(--accent);height:100%;left:0;position:absolute;top:0;width:4px}.todo-item.list{border-radius:8px;padding:12px 16px}.todo-item.list .todo-item-header{align-items:center}.todo-item.list .todo-content{align-items:center;display:flex;gap:16px}.todo-item.list .todo-title{flex:1 1;margin:0}.todo-item.list .todo-description{display:none}.todo-item.list .todo-metadata{align-items:center;flex-direction:row;gap:16px}.todo-item.list .todo-footer{border-top:none;margin-top:0;padding-top:0}.todo-item.list .todo-actions{flex-direction:row;opacity:1}@media (max-width:768px){.todo-item{padding:12px}.todo-title{font-size:15px}.todo-actions{opacity:1}.metadata-row{gap:8px}.tags{gap:4px}}@media (max-width:480px){.todo-item{padding:10px}.todo-item-header{gap:8px}.todo-title{font-size:14px}.metadata-row{gap:6px}.metadata-row,.todo-item.list .todo-content{align-items:flex-start;flex-direction:column}.todo-item.list .todo-content{gap:8px}.todo-item.list .todo-metadata{align-items:flex-start;flex-direction:column;gap:6px}}.todo-list{grid-gap:16px;display:grid;gap:16px;padding:20px 0}.todo-list.grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.todo-list.list{grid-template-columns:1fr}@media (max-width:768px){.todo-list{gap:12px;padding:16px 0}.todo-list.grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width:480px){.todo-list{gap:8px;padding:12px 0}.todo-list.grid{grid-template-columns:1fr}}.sidebar-overlay{background:#00000080;bottom:0;right:0;z-index:999}.sidebar,.sidebar-overlay{left:0;position:fixed;top:0}.sidebar{background:var(--bg-primary);border-right:1px solid var(--border);box-shadow:4px 0 12px var(--shadow-lg);height:100vh;overflow-y:auto;width:320px;z-index:1000}.sidebar-header{align-items:center;background:var(--bg-secondary);border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:20px 24px}.sidebar-header h2{color:var(--text-primary);font-size:18px;font-weight:600;margin:0}.close-button{border-radius:4px;padding:4px}.sidebar-content{display:flex;flex-direction:column;gap:32px;padding:24px}.filters-section h3,.stats-section h3{align-items:center;color:var(--text-primary);display:flex;font-size:16px;font-weight:600;gap:8px;margin:0 0 16px}.stats-grid{margin-bottom:16px}.stat-item{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;padding:12px;text-align:center}.stat-value{color:var(--accent);display:block;font-size:20px}.stat-label{letter-spacing:.5px;text-transform:uppercase}.completion-rate{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;padding:16px}.progress-bar{background:var(--bg-tertiary);width:100%}.progress-fill{transition:width .3s ease}.progress-text{display:block;font-weight:500}.filter-group{margin-bottom:20px}.filter-group label{align-items:center;color:var(--text-primary);display:flex;font-size:14px;font-weight:500;gap:6px;margin-bottom:8px}.filter-options{display:flex;flex-direction:column;gap:4px}.filter-option{align-items:center;background:none;border:none;border-radius:6px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;gap:8px;padding:8px 12px;position:relative;text-align:left;transition:all .2s ease}.filter-option:hover{background:var(--bg-secondary);color:var(--text-primary)}.filter-option.active{background:var(--accent);color:#fff}.filter-option .count{background:#fff3;border-radius:10px;color:inherit;font-size:11px;font-weight:500;margin-left:auto;padding:2px 6px}.filter-option.active .count{background:#ffffff4d}.priority-dot{border-radius:50%;flex-shrink:0;height:8px;width:8px}.tag-option{font-size:13px;text-transform:lowercase}.more-tags{color:var(--text-secondary);font-size:12px;font-style:italic;padding:4px 12px}.clear-filters{background:var(--error);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;margin-top:8px;padding:10px 16px;transition:all .2s ease}.clear-filters:hover{background:#dc2626;transform:translateY(-1px)}.user-section{border-top:1px solid var(--border);margin-top:auto;padding-top:20px}.user-info{align-items:center;display:flex;gap:12px}.user-avatar{align-items:center;color:#fff;display:flex;flex-shrink:0;font-size:14px;font-weight:600;justify-content:center}.user-avatar,.user-avatar-image{border-radius:50%;height:40px;width:40px}.user-avatar-image{border:2px solid var(--accent);object-fit:cover}.user-details{flex:1 1;min-width:0}.username{color:var(--text-primary);font-size:14px;font-weight:600;margin-bottom:2px}.user-email{color:var(--text-secondary);font-size:12px;word-break:break-all}@media (max-width:768px){.sidebar{width:280px}.sidebar-content{gap:24px;padding:20px}.stats-grid{gap:8px}.stat-item{padding:10px}.stat-value{font-size:18px}}@media (max-width:480px){.sidebar{width:100vw}}.ai-section{margin-bottom:24px}.ai-section h3{align-items:center;color:var(--text-primary);display:flex;font-size:14px;font-weight:600;gap:8px;margin:0 0 12px;padding:0 4px}.ai-section h3 .icon{color:var(--primary)}.ai-menu{display:flex;flex-direction:column;gap:4px}.ai-menu-item{align-items:center;background:none;border:none;border-radius:8px;color:var(--text-secondary);cursor:pointer;display:flex;font-size:14px;gap:12px;padding:12px 16px;text-align:left;transition:all .2s ease;width:100%}.ai-menu-item:hover{background:var(--bg-secondary);color:var(--text-primary)}.ai-menu-item .icon{color:var(--primary);flex-shrink:0}.ai-menu-item span{font-weight:500}.sidebar::-webkit-scrollbar{width:4px}.sidebar::-webkit-scrollbar-track{background:var(--bg-secondary)}.sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.sidebar::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.stats-panel{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:24px}.stat-card{background:var(--bg-primary);border-radius:12px;cursor:pointer;gap:16px;padding:20px;transition:all .2s ease}.stat-card:hover{border-color:var(--accent);transform:translateY(-2px)}.stat-icon{align-items:center;background:var(--bg-secondary);border-radius:12px;display:flex;flex-shrink:0;height:48px;justify-content:center;width:48px}.stat-content{flex:1 1}.stat-value{font-size:24px;font-weight:700;line-height:1;margin-bottom:4px}.stat-label{font-size:14px;font-weight:500}.progress-card{background:var(--bg-primary);border:1px solid var(--border);border-radius:12px;cursor:pointer;grid-column:1/-1;padding:20px;transition:all .2s ease}.progress-card:hover{border-color:var(--accent);transform:translateY(-1px)}.progress-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:12px}.progress-title{color:var(--text-primary);font-size:16px;font-weight:600}.progress-percentage{color:var(--accent);font-size:18px;font-weight:700}.progress-bar{background:var(--bg-secondary);border-radius:4px;height:8px;margin-bottom:8px}.progress-fill{background:linear-gradient(90deg,var(--accent) 0,var(--success) 100%);border-radius:4px}.progress-text{color:var(--text-secondary);font-size:12px;text-align:center}@media (max-width:768px){.stats-panel{gap:12px;grid-template-columns:repeat(2,1fr);margin-bottom:20px}.stat-card{padding:16px}.stat-icon{height:40px;width:40px}.stat-value{font-size:20px}.stat-label{font-size:13px}.progress-card{padding:16px}}@media (max-width:480px){.stats-panel{gap:8px;grid-template-columns:1fr;margin-bottom:16px}.stat-card{gap:12px;padding:14px}.stat-icon{height:36px;width:36px}.stat-value{font-size:18px}.stat-label{font-size:12px}.progress-title{font-size:14px}.progress-percentage{font-size:16px}}.profile-section-overlay{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:2000}.profile-section{background:var(--bg-primary);border:1px solid var(--border);border-radius:20px;box-shadow:0 20px 40px var(--shadow-lg);max-height:90vh;max-width:600px;overflow-y:auto;position:relative;width:100%}.profile-header{align-items:center;background:var(--bg-secondary);border-bottom:1px solid var(--border);border-radius:20px 20px 0 0;display:flex;justify-content:space-between;padding:24px}.profile-header h2{align-items:center;color:var(--text-primary);display:flex;font-size:24px;font-weight:600;gap:12px;margin:0}.close-button{background:none;border:none;border-radius:8px;color:var(--text-secondary);cursor:pointer;padding:8px;transition:all .2s ease}.close-button:hover{background:var(--bg-tertiary);color:var(--text-primary)}.notification{border:1px solid;border-radius:8px;font-size:14px;font-weight:500;margin:0 24px 16px;padding:12px 16px}.notification.success{background:#10b9811a;border-color:var(--success);color:var(--success)}.notification.error{background:#ef44441a;border-color:var(--error);color:var(--error)}.profile-picture-section{align-items:center;background:var(--bg-secondary);border-bottom:1px solid var(--border);display:flex;flex-direction:column;padding:32px 24px 24px}.profile-picture-container{margin-bottom:16px;position:relative}.profile-picture{object-fit:cover}.profile-picture,.profile-picture-placeholder{border:4px solid var(--accent);border-radius:50%;box-shadow:0 8px 24px var(--shadow-lg);height:120px;width:120px}.profile-picture-placeholder{background:var(--bg-tertiary);color:var(--text-secondary);font-size:24px;font-weight:600}.profile-picture-placeholder,.upload-overlay{align-items:center;display:flex;justify-content:center}.upload-overlay{background:#0009;border-radius:50%;bottom:0;left:0;position:absolute;right:0;top:0}.upload-spinner{animation:spin 1s linear infinite;border:3px solid #ffffff4d;border-radius:50%;border-top-color:#fff;height:32px;width:32px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.profile-picture-actions{bottom:-8px;display:flex;gap:8px;position:absolute;right:-8px}.picture-action-btn{align-items:center;border:2px solid var(--bg-primary);border-radius:50%;box-shadow:0 4px 12px var(--shadow);cursor:pointer;display:flex;height:40px;justify-content:center;transition:all .2s ease;width:40px}.upload-btn{background:var(--accent);color:#fff}.upload-btn:hover{background:var(--accent-hover);transform:scale(1.1)}.remove-btn{background:var(--error);color:#fff}.remove-btn:hover{background:#dc2626;transform:scale(1.1)}.picture-action-btn:disabled{cursor:not-allowed;opacity:.5;transform:none}.profile-info{padding:24px}.profile-actions{display:flex;justify-content:flex-end;margin-bottom:24px}.edit-button{align-items:center;background:var(--accent);border:none;border-radius:10px;color:#fff;cursor:pointer;display:flex;font-weight:500;gap:8px;padding:12px 20px;transition:all .2s ease}.edit-button:hover{background:var(--accent-hover);box-shadow:0 4px 12px var(--shadow);transform:translateY(-2px)}.edit-actions{display:flex;gap:12px}.cancel-button,.save-button{align-items:center;border:none;border-radius:10px;cursor:pointer;display:flex;font-weight:500;gap:8px;padding:12px 20px;transition:all .2s ease}.save-button{background:var(--success);color:#fff}.save-button:hover{background:#059669;transform:translateY(-2px)}.cancel-button{background:var(--bg-tertiary);color:var(--text-secondary)}.cancel-button:hover{background:var(--border);color:var(--text-primary)}.profile-fields{gap:20px;margin-bottom:32px}.field-group,.profile-fields{display:flex;flex-direction:column}.field-group{gap:8px}.field-group label{font-size:14px;font-weight:500;gap:8px}.field-group label,.field-value{align-items:center;color:var(--text-primary);display:flex}.field-value{background:var(--bg-secondary);border:1px solid var(--border);border-radius:10px;min-height:44px;padding:12px 16px}.field-value.bio{align-items:flex-start;line-height:1.5;min-height:80px;padding-top:12px;white-space:pre-wrap}.field-group input,.field-group textarea{background:var(--bg-primary);border:2px solid var(--border);border-radius:10px;color:var(--text-primary);font-family:inherit;font-size:14px;padding:12px 16px;resize:vertical;transition:all .2s ease}.field-group input:focus,.field-group textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #3b82f61a;outline:none}.field-group textarea{line-height:1.5;min-height:100px}.account-info{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:20px}.account-info h3{color:var(--text-primary);font-size:18px;font-weight:600;margin:0 0 16px}.info-row{align-items:center;color:var(--text-secondary);display:flex;font-size:14px;gap:12px;padding:8px 0}.info-row:not(:last-child){border-bottom:1px solid var(--border)}@media (max-width:768px){.profile-section-overlay{padding:10px}.profile-section{border-radius:16px;max-width:100%}.profile-header{border-radius:16px 16px 0 0;padding:20px}.profile-header h2{font-size:20px}.profile-picture-section{padding:24px 20px 20px}.profile-picture,.profile-picture-placeholder{height:100px;width:100px}.profile-info{padding:20px}.edit-actions{flex-direction:column}.cancel-button,.save-button{justify-content:center}}@media (max-width:480px){.profile-section-overlay{padding:5px}.profile-header{padding:16px}.profile-picture-section{padding:20px 16px 16px}.account-info,.profile-info{padding:16px}}.confirm-overlay{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:3000}.confirm-dialog{background:var(--bg-primary);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 40px var(--shadow-lg);max-width:400px;overflow:hidden;position:relative;width:100%}.confirm-header{align-items:flex-start;display:flex;justify-content:space-between;padding:24px 24px 0}.confirm-icon{align-items:center;border-radius:50%;display:flex;height:48px;justify-content:center;margin-bottom:16px;width:48px}.danger-icon{background:#ef44441a;color:var(--error)}.danger-icon,.warning-icon{border-radius:50%;padding:12px}.warning-icon{background:#f59e0b1a;color:var(--warning)}.info-icon{background:#10b9811a;border-radius:50%;color:var(--success);padding:12px}.close-btn{border-radius:6px;padding:4px}.close-btn:hover{background:var(--bg-secondary)}.confirm-content{padding:0 24px 24px}.confirm-title{color:var(--text-primary);font-size:20px;font-weight:600;line-height:1.3;margin:0 0 12px}.confirm-message{color:var(--text-secondary);font-size:14px;line-height:1.5;margin:0}.confirm-actions{display:flex;gap:12px;justify-content:flex-end;padding:0 24px 24px}.btn{border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;min-width:80px;padding:10px 20px;transition:all .2s ease}.btn-secondary{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary)}.btn-secondary:hover{background:var(--bg-tertiary)}.btn-danger{background:var(--error);color:#fff}.btn-danger:hover{background:#dc2626}.btn-warning{background:var(--warning);color:#fff}.btn-warning:hover{background:#d97706}.btn-info{background:var(--success);color:#fff}.btn-info:hover{background:#059669}@media (max-width:480px){.confirm-overlay{padding:16px}.confirm-dialog{max-width:100%}.confirm-header{padding:20px 20px 0}.confirm-actions,.confirm-content{padding:0 20px 20px}.confirm-actions{flex-direction:column-reverse}.btn{width:100%}}.shortcuts-overlay{align-items:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:3000}.shortcuts-dialog{background:var(--bg-primary);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 40px var(--shadow-lg);max-height:80vh;max-width:600px;overflow-y:auto;position:relative;width:100%}.shortcuts-header{align-items:center;background:var(--bg-secondary);border-bottom:1px solid var(--border);border-radius:16px 16px 0 0;display:flex;justify-content:space-between;padding:24px}.shortcuts-header h2{align-items:center;color:var(--text-primary);display:flex;font-size:24px;font-weight:600;gap:12px;margin:0}.close-btn{background:none;border:none;border-radius:8px;color:var(--text-secondary);cursor:pointer;padding:8px;transition:all .2s ease}.close-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.shortcuts-content{padding:24px}.shortcut-category{margin-bottom:32px}.shortcut-category:last-child{margin-bottom:0}.category-title{border-bottom:2px solid var(--accent);color:var(--text-primary);font-size:18px;font-weight:600;margin:0 0 16px;padding-bottom:8px}.shortcut-list{display:flex;flex-direction:column;gap:12px}.shortcut-item{align-items:center;background:var(--bg-secondary);border-radius:8px;display:flex;justify-content:space-between;padding:12px 16px;transition:all .2s ease}.shortcut-item:hover{background:var(--bg-tertiary)}.shortcut-description{color:var(--text-primary);font-size:14px;font-weight:500}.shortcut-keys{align-items:center;display:flex;gap:4px}.key{background:var(--bg-primary);border:1px solid var(--border);border-radius:4px;box-shadow:0 1px 2px var(--shadow);color:var(--text-primary);font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace;font-weight:600;min-width:24px;padding:4px 8px;text-align:center}.key,.plus{font-size:12px}.plus{color:var(--text-secondary);margin:0 2px}.shortcuts-footer{background:var(--bg-secondary);border-radius:0 0 16px 16px;border-top:1px solid var(--border);padding:20px 24px}.shortcuts-tip{margin-bottom:12px}.shortcuts-tip p{font-size:14px;margin:0 0 6px}.shortcuts-tip p:first-child{color:var(--text-primary);font-weight:500}.shortcuts-tip p:last-child{color:var(--text-secondary);font-size:13px}.shortcuts-note{border-top:1px solid var(--border);padding-top:12px;text-align:center}.platform-note{color:var(--text-tertiary);font-size:12px;font-style:italic;margin:0}.shortcuts-footer .key{margin:0 2px}@media (max-width:768px){.shortcuts-overlay{padding:16px}.shortcuts-dialog{max-height:85vh;max-width:100%}.shortcuts-header{padding:20px}.shortcuts-header h2{font-size:20px}.shortcuts-content{padding:20px}.shortcut-category{margin-bottom:24px}.category-title{font-size:16px}.shortcut-item{align-items:flex-start;flex-direction:column;gap:8px;padding:12px}.shortcut-keys{align-self:flex-end}}@media (max-width:480px){.shortcuts-overlay{padding:12px}.shortcuts-content,.shortcuts-header{padding:16px}.shortcuts-footer{padding:12px 16px}}.shortcut-tip{background:var(--bg-primary);border:1px solid var(--border);border-radius:12px;bottom:80px;box-shadow:0 8px 24px var(--shadow-lg);overflow:hidden;position:fixed;right:20px;width:280px;z-index:998}.tip-header{background:var(--bg-secondary);border-bottom:1px solid var(--border);justify-content:space-between;padding:12px 16px}.tip-header,.tip-icon{align-items:center;display:flex}.tip-icon{color:var(--primary)}.tip-close{background:none;border:none;border-radius:3px;color:var(--text-secondary);cursor:pointer;padding:2px;transition:all .2s ease}.tip-close:hover{background:var(--bg-primary);color:var(--text-primary)}.tip-content{align-items:center;display:flex;gap:12px;padding:16px}.tip-emoji{flex-shrink:0;font-size:24px}.tip-text{display:flex;flex:1 1;flex-direction:column;gap:4px}.tip-key{background:var(--bg-secondary);border:1px solid var(--border);border-radius:4px;box-shadow:0 1px 2px var(--shadow-sm);color:var(--text-primary);font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace;font-size:11px;font-weight:600;padding:4px 8px;width:-webkit-fit-content;width:fit-content}.tip-action{color:var(--text-secondary);font-size:13px;line-height:1.4}.tip-footer{align-items:center;background:var(--bg-secondary);border-top:1px solid var(--border);display:flex;justify-content:space-between;padding:12px 16px}.tip-next{background:none;border:none;border-radius:4px;color:var(--primary);cursor:pointer;font-size:12px;font-weight:500;padding:4px 8px;transition:all .2s ease}.tip-next:hover{background:var(--primary);color:#fff}.tip-dots{display:flex;gap:4px}.tip-dot{background:var(--border);border-radius:50%;height:6px;transition:all .2s ease;width:6px}.tip-dot.active{background:var(--primary);transform:scale(1.2)}@keyframes tipPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.shortcut-tip:hover{animation:tipPulse 2s ease-in-out infinite}@media (max-width:768px){.shortcut-tip{bottom:70px;left:16px;right:16px;width:auto}}@media (max-width:480px){.shortcut-tip{display:none}}.todo-app{background:var(--bg-primary);display:flex;flex-direction:column;min-height:100vh}.todo-app-content{display:flex;flex:1 1;position:relative}.main-content{flex:1 1;max-width:100%;overflow-y:auto;padding:20px}.empty-state{align-items:center;display:flex;justify-content:center;min-height:300px;text-align:center}.empty-state-content h3{color:var(--text-primary);font-size:24px;margin-bottom:12px}.empty-state-content p{color:var(--text-secondary);font-size:16px;margin-bottom:24px;max-width:400px}.create-first-todo{background:var(--accent);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;font-weight:600;padding:12px 24px;transition:all .2s ease}.create-first-todo:hover{background:var(--accent-hover);transform:translateY(-1px)}@media (max-width:768px){.main-content{padding:16px}}@media (max-width:480px){.main-content{padding:12px}.empty-state-content h3{font-size:20px}.empty-state-content p{font-size:14px}}.ai-settings-overlay{align-items:center;background:#0009;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:2000}.ai-settings-modal{background:var(--bg-primary);border:1px solid var(--border);border-radius:16px;box-shadow:0 32px 64px var(--shadow-lg);max-height:90vh;max-width:700px;overflow-y:auto;width:100%}.ai-settings-header{align-items:center;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:24px}.ai-settings-header h2{align-items:center;color:var(--text-primary);display:flex;font-size:24px;font-weight:600;gap:12px;margin:0}.ai-settings-header .icon{color:var(--primary)}.ai-settings-content{padding:24px}.settings-section{margin-bottom:32px}.settings-section h3{align-items:center;color:var(--text-primary);display:flex;font-size:18px;font-weight:600;gap:8px;margin-bottom:8px}.settings-section .icon{color:var(--primary)}.settings-description{color:var(--text-secondary);line-height:1.5;margin-bottom:16px}.api-key-input-group{display:flex;gap:12px;margin-bottom:12px}.api-key-input{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);flex:1 1;font-size:14px;padding:12px}.api-key-actions{display:flex;gap:8px}.btn-primary,.btn-secondary{border:1px solid;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;padding:8px 16px;transition:all .2s ease}.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--primary-dark);border-color:var(--primary-dark)}.btn-secondary{background:#0000;border-color:var(--border);color:var(--text-secondary)}.btn-secondary:hover:not(:disabled){background:var(--bg-secondary);color:var(--text-primary)}.api-status,.test-result{align-items:center;border-radius:6px;display:flex;font-size:14px;gap:8px;margin-top:8px;padding:8px 12px}.api-status.success,.test-result.success{background:#10b9811a;border:1px solid #10b9814d;color:var(--success)}.api-status.error,.test-result.error{background:#ef44441a;border:1px solid #ef44444d;color:var(--error)}.api-info{align-items:center;background:var(--bg-secondary);border-radius:6px;color:var(--text-secondary);display:flex;font-size:14px;gap:8px;margin-top:12px;padding:8px 12px}.api-info a{color:var(--primary);text-decoration:none}.api-info a:hover{text-decoration:underline}.features-grid{grid-gap:16px;display:grid;gap:16px}.feature-card{align-items:center;background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;display:flex;justify-content:space-between;padding:16px;transition:all .2s ease}.feature-card:hover{background:var(--bg-primary);border-color:var(--primary)}.feature-info h4{color:var(--text-primary);font-size:16px;font-weight:600;margin:0 0 4px}.feature-info p{color:var(--text-secondary);font-size:14px;line-height:1.4;margin:0}.toggle-switch{display:inline-block;height:24px;position:relative;width:48px}.toggle-switch input{height:0;opacity:0;width:0}.toggle-slider{background-color:var(--border);border-radius:24px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:.3s}.toggle-slider:before{background-color:#fff;border-radius:50%;bottom:3px;box-shadow:0 2px 4px #0003;content:"";height:18px;left:3px;position:absolute;transition:.3s;width:18px}input:checked+.toggle-slider{background-color:var(--primary)}input:checked+.toggle-slider:before{transform:translateX(24px)}.ai-insights-panel{background:var(--bg-primary);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 24px var(--shadow-lg);max-height:calc(100vh - 120px);overflow-y:auto;position:fixed;right:20px;top:80px;width:320px;z-index:1000}.insights-header{align-items:center;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;padding:16px}.insights-header h3{align-items:center;color:var(--text-primary);display:flex;font-size:16px;font-weight:600;gap:8px;margin:0}.refresh-button{background:none;border:none;border-radius:4px;color:var(--text-secondary);cursor:pointer;padding:4px;transition:all .2s ease}.refresh-button:hover{background:var(--bg-secondary);color:var(--text-primary)}.loading-state{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:32px 16px;text-align:center}.loading-state p{color:var(--text-secondary);font-size:14px;margin-top:12px}.insights-content{padding:16px}.stats-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:1fr 1fr;margin-bottom:20px}.stat-card{align-items:center;background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;display:flex;gap:8px;padding:12px}.stat-card .icon{color:var(--primary);flex-shrink:0}.stat-info{display:flex;flex-direction:column}.stat-value{color:var(--text-primary);font-size:16px;font-weight:600}.stat-label{color:var(--text-secondary);font-size:12px}.insights-section{margin-bottom:20px}.insights-section h4{align-items:center;color:var(--text-primary);display:flex;font-size:14px;font-weight:600;gap:6px;margin:0 0 12px}.category-chart{gap:8px}.category-bar,.category-chart{display:flex;flex-direction:column}.category-bar{gap:4px}.category-info{display:flex;font-size:12px;justify-content:space-between}.category-name{color:var(--text-primary);font-weight:500}.category-count{color:var(--text-secondary)}.progress-bar{background:var(--border);border-radius:2px;height:4px;overflow:hidden}.progress-fill{background:var(--primary);border-radius:2px;height:100%}.insights-list,.suggestions-list{display:flex;flex-direction:column;gap:8px}.insight-card{border:1px solid var(--border);border-radius:6px;display:flex;gap:12px;padding:12px}.insight-card.success{background:#10b9810d;border-color:#10b98133}.insight-card.warning{background:#f59e0b0d;border-color:#f59e0b33}.insight-card.suggestion{background:#3b82f60d;border-color:#3b82f633}.insight-card.info{background:#6b72800d;border-color:#6b728033}.insight-icon{align-items:flex-start;display:flex;gap:4px}.insight-emoji{font-size:16px}.insight-content h5{color:var(--text-primary);font-size:13px;font-weight:600;margin:0 0 4px}.insight-content p{color:var(--text-secondary);font-size:12px;line-height:1.4;margin:0}.suggestion-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;padding:12px}.suggestion-content h5{color:var(--text-primary);font-size:13px;font-weight:600;margin:0 0 6px}.suggestion-meta{display:flex;gap:8px;margin-bottom:4px}.suggestion-category,.suggestion-priority{background:var(--primary);border-radius:3px;color:#fff;font-size:10px;padding:2px 6px}.suggestion-reason{color:var(--text-secondary);font-size:12px;margin:0}.insights-footer{border-top:1px solid var(--border);padding-top:12px;text-align:center}.last-updated{color:var(--text-secondary);font-size:11px;margin:0}@media (max-width:768px){.ai-insights-panel{border:none;border-radius:0;bottom:0;left:0;max-height:100vh;position:fixed;right:0;top:0;width:100%}.ai-settings-modal{border-radius:0;max-height:100vh}.features-grid,.stats-grid{grid-template-columns:1fr}}.theme-selector{bottom:24px;position:fixed;right:24px;z-index:1000}.theme-toggle{align-items:center;background:var(--accent);border:none;border-radius:50%;box-shadow:0 4px 12px var(--shadow-lg);color:#fff;cursor:pointer;display:flex;height:56px;justify-content:center;transition:all .2s ease;width:56px}.theme-toggle:hover{background:var(--accent-hover);box-shadow:0 6px 16px var(--shadow-lg)}.theme-overlay{background:#0000004d;bottom:0;left:0;position:fixed;right:0;top:0;z-index:999}.theme-menu{background:var(--bg-primary);border:1px solid var(--border);border-radius:16px;bottom:70px;box-shadow:0 12px 32px var(--shadow-lg);max-width:320px;min-width:280px;padding:20px;pointer-events:auto;position:absolute;right:0;z-index:1001}.theme-menu-header{margin-bottom:16px;text-align:center}.theme-menu-header h3{color:var(--text-primary);font-size:18px;font-weight:600;margin:0 0 4px}.theme-menu-header p{color:var(--text-secondary);font-size:14px;margin:0}.theme-options{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.theme-option{align-items:center;background:none;border:2px solid var(--border);border-radius:12px;cursor:pointer;display:flex;gap:12px;overflow:hidden;padding:12px 16px;pointer-events:auto;position:relative;text-align:left;transition:all .2s ease}.theme-option:hover{background:var(--bg-secondary);border-color:var(--accent)}.theme-option.active{background:#3b82f61a;border-color:var(--accent)}.theme-icon{align-items:center;background:var(--bg-secondary);border-radius:8px;color:var(--text-primary);display:flex;flex-shrink:0;height:36px;justify-content:center;width:36px}.theme-option.active .theme-icon{background:var(--accent);color:#fff}.theme-info{flex:1 1}.theme-name{color:var(--text-primary);font-size:14px;font-weight:600;margin-bottom:2px}.theme-description{color:var(--text-secondary);font-size:12px}.theme-check{color:var(--accent);font-size:16px;font-weight:700}.theme-preview-dots{align-items:center;display:flex;gap:4px}.preview-dot{border:1px solid #ffffff4d;border-radius:50%;height:8px;width:8px}.bg-light{background:#fff;border-color:#e2e8f0}.accent-light{background:#3b82f6}.bg-dark{background:#0f172a;border-color:#334155}.accent-dark{background:#60a5fa}.bg-minimal{background:#fff;border-color:#e6e6e6}.accent-minimal{background:#2d2d2d}.bg-ocean{background:#f0f9ff;border-color:#7dd3fc}.accent-ocean{background:#0ea5e9}.theme-preview{border-top:1px solid var(--border);padding-top:16px}.preview-label{color:var(--text-secondary);font-size:12px;font-weight:500;margin-bottom:8px;text-align:center}.preview-colors{display:flex;gap:8px;justify-content:center;margin-bottom:8px}.color-sample{border:1px solid var(--border);border-radius:50%;cursor:pointer;height:18px;transition:transform .2s ease;width:18px}.color-sample:hover{transform:scale(1.2)}.color-sample.primary{background:var(--bg-primary)}.color-sample.secondary{background:var(--bg-secondary)}.color-sample.accent{background:var(--accent)}.color-sample.text{background:var(--text-primary)}.theme-features{color:var(--text-secondary);font-size:11px;font-style:italic;text-align:center}@media (max-width:768px){.theme-selector{bottom:20px;right:20px}.theme-toggle{height:48px;width:48px}.theme-menu{bottom:60px;min-width:260px;padding:16px}.theme-option{padding:10px 12px}.theme-icon{height:32px;width:32px}}@media (max-width:480px){.theme-selector{bottom:16px;right:16px}.theme-menu{min-width:240px;right:-60px}}.app{min-height:100vh;position:relative}.loading-container{align-items:center;background-color:var(--bg-primary);display:flex;justify-content:center;min-height:100vh}.loading-spinner{border-top:3px solid var(--border);border:3px solid var(--border);border-radius:50%;border-top-color:var(--accent);height:40px;width:40px}@media (max-width:768px){.app{padding:10px}}@media (max-width:480px){.app{padding:5px}}
/*# sourceMappingURL=main.eb441b0e.css.map*/