.dashboard{max-width:var(--content-wide);margin:0 auto}.dashboard-header{margin-bottom:var(--space-8)}.dashboard-title{font-size:clamp(1.5rem,3vw,2rem);font-weight:700;margin-bottom:var(--space-1)}.dashboard-subtitle{color:var(--color-text-muted)}.dashboard-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--space-4);margin-bottom:var(--space-8)}.stat-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-sm)}.stat-label{font-size:.8rem;color:var(--color-text-muted);margin-bottom:var(--space-2)}.stat-value{font-size:2rem;font-weight:700;line-height:1}.dashboard-section{margin-bottom:var(--space-8)}.dashboard-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-4)}.dashboard-section-title{font-weight:600;font-size:1.1rem}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-4)}.project-card{display:block;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-5);box-shadow:var(--shadow-sm);text-decoration:none;transition:box-shadow var(--transition),transform var(--transition)}.project-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.project-card-header{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}.project-card-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.project-card-name{font-weight:600;font-size:.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-text)}.project-card-desc{font-size:.825rem;color:var(--color-text-muted);margin-bottom:var(--space-4);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.project-card-footer{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-2)}.project-card-tasks{font-size:.75rem;color:var(--color-text-muted)}.project-card-pct{font-size:.75rem;font-weight:600;color:var(--color-primary)}.project-card-bar{height:4px;background:var(--color-surface-offset);border-radius:99px;overflow:hidden}.project-card-bar-fill{height:100%;border-radius:99px;transition:width .4s ease}.empty-state{text-align:center;padding:var(--space-12);background:var(--color-surface);border:1px dashed var(--color-border);border-radius:var(--radius-xl)}.empty-state-icon{font-size:2rem;margin-bottom:var(--space-3)}.empty-state-title{font-weight:500;margin-bottom:var(--space-2)}.empty-state-desc{color:var(--color-text-muted);font-size:.875rem}.badge-viewer{font-size:.7rem;background:var(--color-surface-offset);color:var(--color-text-muted);padding:2px 8px;border-radius:99px}@media (max-width: 600px){.dashboard-stats{grid-template-columns:repeat(2,1fr)}.project-grid{grid-template-columns:1fr}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--space-4)}.modal{background:var(--color-surface);border-radius:var(--radius-xl);padding:var(--space-8);width:100%;max-width:480px;box-shadow:var(--shadow-lg);max-height:90vh;overflow-y:auto}.modal-sm{max-width:420px}.modal-lg{max-width:560px}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-6)}.modal-title{font-weight:600;font-size:1.1rem}.modal-close{color:var(--color-text-muted);padding:var(--space-1);border-radius:var(--radius-sm);transition:color var(--transition);display:flex}.modal-close:hover{color:var(--color-text)}.modal-footer{display:flex;gap:var(--space-3);margin-top:var(--space-6);justify-content:flex-end}.modal-footer-split{justify-content:space-between}.form-group{display:flex;flex-direction:column;gap:var(--space-4)}.form-field{display:flex;flex-direction:column;gap:var(--space-2)}.form-label{font-size:.8rem;font-weight:500;color:var(--color-text)}.form-label-muted{font-size:.8rem;font-weight:500;color:var(--color-text-muted)}.form-input{width:100%;padding:var(--space-3) var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);font-size:.9rem;color:var(--color-text);transition:border-color var(--transition)}.form-input:focus{outline:none;border-color:var(--color-primary)}.form-input:disabled{opacity:.6;cursor:not-allowed}.form-textarea{resize:vertical;min-height:80px}.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}.alert{padding:var(--space-3);border-radius:var(--radius-md);font-size:.875rem;margin-bottom:var(--space-4)}.alert-error{background:var(--color-error-highlight);color:var(--color-error)}.alert-success{background:var(--color-success-highlight);color:var(--color-success)}.btn{padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);font-weight:500;font-size:.9rem;transition:all var(--transition);display:inline-flex;align-items:center;gap:var(--space-2);cursor:pointer;border:none}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn-ghost{background:transparent;color:var(--color-text-muted);border:1px solid var(--color-border)}.btn-ghost:hover:not(:disabled){color:var(--color-text);background:var(--color-surface-offset)}.btn-danger{background:transparent;color:var(--color-error);border:1px solid var(--color-error)}.btn-danger:hover:not(:disabled){background:var(--color-error-highlight)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:.825rem}.btn-full{width:100%;justify-content:center}.color-picker{display:flex;gap:var(--space-2);flex-wrap:wrap}.color-dot{width:28px;height:28px;border-radius:50%;border:3px solid transparent;cursor:pointer;transition:border-color var(--transition)}.color-dot.selected{border-color:var(--color-text)}.reminder-box{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3);background:var(--color-surface-offset);border-radius:var(--radius-md)}.reminder-icon{color:var(--color-text-muted);margin-top:2px;flex-shrink:0}.checkbox-row{display:flex;align-items:center;gap:var(--space-3);cursor:pointer;font-size:.875rem}.checkbox-row input{width:16px;height:16px;accent-color:var(--color-primary);cursor:pointer}.kanban-board{display:flex;gap:var(--space-4);overflow-x:auto;padding-bottom:var(--space-4);align-items:flex-start}.kanban-board::-webkit-scrollbar{height:6px}.kanban-column{min-width:280px;width:280px;display:flex;flex-direction:column;gap:var(--space-3);flex-shrink:0}.kanban-column-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-2) var(--space-1)}.kanban-column-title{display:flex;align-items:center;gap:var(--space-2)}.kanban-column-dot{width:10px;height:10px;border-radius:50%}.kanban-column-name{font-weight:600;font-size:.875rem}.kanban-column-count{font-size:.75rem;background:var(--color-surface-offset);color:var(--color-text-muted);padding:1px 8px;border-radius:99px}.kanban-column-add{color:var(--color-text-muted);font-size:1.25rem;line-height:1;padding:0 var(--space-1);border-radius:var(--radius-sm);transition:color var(--transition)}.kanban-column-add:hover{color:var(--color-primary)}.kanban-droppable{background:var(--color-surface-offset);border-radius:var(--radius-lg);padding:var(--space-3);display:flex;flex-direction:column;gap:var(--space-2);min-height:120px}.kanban-empty{text-align:center;padding:var(--space-4);color:var(--color-text-faint);font-size:.8rem}.task-card{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-3) var(--space-4);cursor:pointer;transition:box-shadow var(--transition);box-shadow:var(--shadow-sm)}.task-card:hover{box-shadow:var(--shadow-md)}.task-card.dragging{opacity:.4}.task-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-2)}.task-card-title{font-size:.875rem;font-weight:500;line-height:1.4;flex:1;color:var(--color-text)}.task-card-title.completed{text-decoration:line-through;color:var(--color-text-muted);font-weight:400}.task-card-priority{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:4px}.task-card-desc{font-size:.775rem;color:var(--color-text-muted);margin-top:var(--space-1);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.task-card-meta{display:flex;gap:var(--space-2);margin-top:var(--space-2);flex-wrap:wrap;align-items:center}.task-card-date{font-size:.72rem;color:var(--color-text-muted);display:flex;align-items:center;gap:4px}.task-card-date.overdue{color:var(--color-error)}.task-tag{font-size:.7rem;background:var(--color-primary-highlight);color:var(--color-primary);padding:1px 8px;border-radius:99px}.notes-container{display:flex;height:calc(100vh - 180px);min-height:400px;border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;background:var(--color-surface)}.notes-sidebar{width:220px;border-right:1px solid var(--color-divider);display:flex;flex-direction:column;flex-shrink:0}.notes-sidebar-header{padding:var(--space-4);border-bottom:1px solid var(--color-divider);display:flex;justify-content:space-between;align-items:center}.notes-sidebar-label{font-size:.8rem;font-weight:600;color:var(--color-text-muted)}.notes-sidebar-add{color:var(--color-primary);display:flex;align-items:center}.notes-list{flex:1;overflow-y:auto;padding:var(--space-2)}.notes-section-label{font-size:.7rem;color:var(--color-text-faint);padding:var(--space-2) var(--space-3);font-weight:600}.note-item{width:100%;text-align:left;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:transparent;border:none;cursor:pointer;transition:background var(--transition)}.note-item:hover{background:var(--color-surface-offset)}.note-item.active{background:var(--color-primary-highlight)}.note-item-title{font-size:.875rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--color-text)}.note-item.active .note-item-title{color:var(--color-primary);font-weight:600}.note-item-preview{font-size:.75rem;color:var(--color-text-muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.notes-empty{text-align:center;padding:var(--space-8) var(--space-4);color:var(--color-text-faint)}.notes-empty-icon{font-size:1.5rem;margin-bottom:var(--space-2)}.notes-empty-text{font-size:.8rem}.note-editor{flex:1;display:flex;flex-direction:column;min-width:0}.note-editor-toolbar{padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--color-divider);display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}.note-editor-title{font-size:1.1rem;font-weight:600;background:transparent;border:none;outline:none;flex:1;color:var(--color-text);font-family:var(--font-body)}.note-editor-title::placeholder{color:var(--color-text-faint)}.note-editor-actions{display:flex;gap:var(--space-2);align-items:center}.note-saving{font-size:.75rem;color:var(--color-text-muted)}.note-action-btn{color:var(--color-text-muted);padding:var(--space-2);border-radius:var(--radius-sm);display:flex;transition:color var(--transition)}.note-action-btn:hover{color:var(--color-text)}.note-action-btn.pinned{color:var(--color-orange)}.note-content{flex:1;padding:var(--space-6);border:none;outline:none;resize:none;font-size:.925rem;line-height:1.8;background:transparent;color:var(--color-text);font-family:var(--font-body)}.note-content::placeholder{color:var(--color-text-faint)}.note-footer{padding:var(--space-2) var(--space-6);border-top:1px solid var(--color-divider);font-size:.75rem;color:var(--color-text-faint)}.note-placeholder{flex:1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--space-3);color:var(--color-text-faint)}.note-placeholder-icon{font-size:2.5rem}@media (max-width: 600px){.notes-sidebar{width:160px}}.app-wrapper{display:flex;min-height:100dvh}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0000004d;z-index:199}.sidebar-overlay.active{display:block}.sidebar{width:240px;height:100dvh;background:var(--color-surface);border-right:1px solid var(--color-divider);display:flex;flex-direction:column;position:fixed;top:0;left:0;z-index:200;transform:translate(-100%);transition:transform var(--transition);overflow:hidden}.sidebar.open{transform:translate(0)}.sidebar-logo{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-6) var(--space-4) var(--space-4);margin-bottom:var(--space-2)}.sidebar-logo span{font-weight:700;font-size:1.1rem}.sidebar-nav{padding:0 var(--space-4)}.sidebar-nav-link{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:.9rem;color:var(--color-text-muted);background:transparent;transition:all var(--transition);margin-bottom:var(--space-1);text-decoration:none;border:none;width:100%;cursor:pointer}.sidebar-nav-link:hover{background:var(--color-surface-offset);color:var(--color-text)}.sidebar-nav-link.active{background:var(--color-primary-highlight);color:var(--color-primary);font-weight:600}.sidebar-projects{flex:1;padding:0 var(--space-4);overflow-y:auto}.sidebar-projects-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-2)}.sidebar-projects-label{font-size:.75rem;font-weight:600;color:var(--color-text-faint);text-transform:uppercase;letter-spacing:.05em}.sidebar-projects-add{color:var(--color-text-muted);padding:var(--space-1);border-radius:var(--radius-sm);transition:color var(--transition);display:flex;align-items:center}.sidebar-projects-add:hover{color:var(--color-primary)}.sidebar-project-list{display:flex;flex-direction:column;gap:2px}.sidebar-project-empty{font-size:.8rem;color:var(--color-text-faint);padding:var(--space-2) var(--space-3)}.sidebar-project-link{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:.875rem;color:var(--color-text-muted);background:transparent;transition:all var(--transition);text-decoration:none;overflow:hidden}.sidebar-project-link:hover{background:var(--color-surface-offset);color:var(--color-text)}.sidebar-project-link.active{background:var(--color-surface-offset);color:var(--color-text);font-weight:500}.sidebar-project-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.sidebar-project-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.sidebar-project-role{font-size:.7rem;color:var(--color-text-faint);flex-shrink:0}.sidebar-footer{padding:var(--space-4);border-top:1px solid var(--color-divider)}.sidebar-user{display:flex;align-items:center;gap:var(--space-3)}.sidebar-user-info{flex:1;overflow:hidden}.sidebar-user-name{font-size:.875rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-user-email{font-size:.75rem;color:var(--color-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-logout{color:var(--color-text-muted);padding:var(--space-1);border-radius:var(--radius-sm);transition:color var(--transition);display:flex}.sidebar-logout:hover{color:var(--color-error)}.main-wrapper{flex:1;display:flex;flex-direction:column;min-width:0;margin-left:0;transition:margin-left var(--transition)}.topbar{height:56px;background:var(--color-surface);border-bottom:1px solid var(--color-divider);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-6);position:sticky;top:0;z-index:100;gap:var(--space-4)}.topbar-menu-btn{color:var(--color-text-muted);display:none;align-items:center;padding:var(--space-2);border-radius:var(--radius-md);transition:color var(--transition)}.topbar-menu-btn:hover{color:var(--color-text)}.topbar-spacer{flex:1}.topbar-actions{display:flex;align-items:center;gap:var(--space-3)}.notif-btn{position:relative;color:var(--color-text-muted);padding:var(--space-2);border-radius:var(--radius-md);transition:color var(--transition);display:flex}.notif-btn:hover{color:var(--color-text)}.notif-badge{position:absolute;top:2px;right:2px;width:16px;height:16px;background:var(--color-error);border-radius:50%;font-size:.65rem;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}.notif-dropdown{position:absolute;right:0;top:calc(100% + 8px);width:320px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:300;overflow:hidden}.notif-header{padding:var(--space-4);border-bottom:1px solid var(--color-divider);font-weight:600;font-size:.9rem}.notif-list{max-height:320px;overflow-y:auto}.notif-empty{padding:var(--space-6);text-align:center;color:var(--color-text-muted);font-size:.875rem}.notif-item{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-divider);transition:background var(--transition)}.notif-item.unread{background:var(--color-primary-highlight)}.notif-item.read{opacity:.7}.notif-item-title{font-size:.875rem;font-weight:500}.notif-item-body{font-size:.8rem;color:var(--color-text-muted);margin-top:var(--space-1)}.notif-item-date{font-size:.75rem;color:var(--color-text-faint);margin-top:var(--space-1)}.page-content{flex:1;padding:var(--space-8) var(--space-8);min-width:0}@media (min-width: 768px){.sidebar{transform:translate(0)!important}.main-wrapper{margin-left:240px}.topbar-menu-btn{display:none!important}}@media (max-width: 767px){.topbar-menu-btn{display:flex!important}.page-content{padding:var(--space-4) var(--space-4)}.topbar{padding:0 var(--space-4)}}.project-view{max-width:var(--content-full)}.project-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--space-6);flex-wrap:wrap;gap:var(--space-4)}.project-header-left{display:flex;align-items:center;gap:var(--space-4)}.project-header-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;margin-top:4px}.project-title{font-size:clamp(1.25rem,3vw,1.75rem);font-weight:700}.project-desc{color:var(--color-text-muted);font-size:.875rem;margin-top:2px}.project-header-right{display:flex;align-items:center;gap:var(--space-3)}.collab-avatars{display:flex}.collab-avatar-wrap{margin-left:-8px}.collab-avatar-wrap:first-child{margin-left:0}.tabs{display:flex;gap:var(--space-1);margin-bottom:var(--space-6);background:var(--color-surface-offset);border-radius:var(--radius-lg);padding:var(--space-1);width:fit-content}.tab-btn{padding:var(--space-2) var(--space-5);border-radius:var(--radius-md);font-size:.875rem;color:var(--color-text-muted);background:transparent;transition:all var(--transition);border:none;cursor:pointer;font-weight:400}.tab-btn:hover{color:var(--color-text)}.tab-btn.active{background:var(--color-primary-highlight);color:var(--color-primary);font-weight:600}.invite-hint{font-size:.875rem;color:var(--color-text-muted);margin-bottom:var(--space-6)}.invite-form{display:flex;gap:var(--space-3)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg: #f7f6f2;--color-surface: #f9f8f5;--color-surface-2: #fbfbf9;--color-surface-offset: #f3f0ec;--color-divider: #dcd9d5;--color-border: #d4d1ca;--color-text: #28251d;--color-text-muted: #7a7974;--color-text-faint: #bab9b4;--color-primary: #01696f;--color-primary-hover: #0c4e54;--color-primary-highlight: #cedcd8;--color-success: #437a22;--color-success-highlight: #d4dfcc;--color-warning: #964219;--color-error: #a12c7b;--color-error-highlight: #e0ced7;--color-orange: #da7101;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--shadow-sm: 0 1px 2px rgba(40,37,29,.06);--shadow-md: 0 4px 12px rgba(40,37,29,.08);--shadow-lg: 0 12px 32px rgba(40,37,29,.12);--font-body: "Inter", sans-serif;--transition: .18s cubic-bezier(.16,1,.3,1)}html{font-size:16px;-webkit-font-smoothing:antialiased;scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100dvh}button{cursor:pointer;border:none;background:none;font:inherit;color:inherit}input,textarea,select{font:inherit;color:inherit}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}::selection{background:#01696f33}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:99px}