*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px}body{color:#1f2937;background:#f5f7fa;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}ul,ol{list-style:none}img{max-width:100%;display:block}:root{--color-primary:#4f6ef7;--color-primary-light:#6b85fa;--color-primary-lighter:#eef1fe;--color-primary-dark:#3b57d9;--color-success:#22c55e;--color-success-light:#dcfce7;--color-warning:#f59e0b;--color-warning-light:#fef3c7;--color-danger:#ef4444;--color-danger-light:#fee2e2;--color-info:#3b82f6;--color-info-light:#dbeafe;--color-white:#fff;--color-bg:#f5f7fa;--color-border:#e5e7eb;--color-border-light:#f0f0f0;--color-text:#1f2937;--color-text-secondary:#6b7280;--color-text-placeholder:#9ca3af;--sidebar-width:240px;--sidebar-bg:#fff;--sidebar-active-bg:var(--color-primary-lighter);--sidebar-active-color:var(--color-primary);--sidebar-text:#4b5563;--sidebar-text-active:var(--color-primary);--sidebar-hover-bg:#f9fafb;--sidebar-header-height:60px;--sidebar-footer-height:60px;--header-height:60px;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-full:9999px;--shadow-sm:0 1px 3px #0000000a;--shadow-md:0 2px 8px #0000000f;--shadow-lg:0 4px 16px #00000014;--shadow-xl:0 8px 24px #0000001f;--transition-fast:.15s ease;--transition-normal:.25s ease}h1{color:var(--color-text);font-size:24px;font-weight:600;line-height:1.4}h2{color:var(--color-text);font-size:20px;font-weight:600;line-height:1.4}h3{color:var(--color-text);font-size:16px;font-weight:600;line-height:1.4}h4{color:var(--color-text);font-size:14px;font-weight:600;line-height:1.4}.text-secondary{color:var(--color-text-secondary)}.text-sm{font-size:12px}.text-xs{font-size:11px}.layout{min-height:100vh;display:flex}.layout--login{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);justify-content:center;align-items:center;min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--sidebar-bg);border-right:1px solid var(--color-border);z-index:100;flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0;overflow-y:auto}.sidebar-header{height:var(--sidebar-header-height);padding:0 var(--space-md);border-bottom:1px solid var(--color-border);flex-shrink:0;align-items:center;display:flex}.sidebar-logo{align-items:center;gap:var(--space-sm);color:var(--color-primary);font-size:16px;font-weight:700;display:flex}.sidebar-logo-icon{background:var(--color-primary);border-radius:var(--radius-sm);color:#fff;justify-content:center;align-items:center;width:32px;height:32px;font-size:14px;font-weight:700;display:flex}.sidebar-nav{padding:var(--space-md) 0;flex:1}.sidebar-section{margin-bottom:var(--space-sm)}.sidebar-section-title{padding:var(--space-sm) var(--space-lg);color:var(--color-text-placeholder);text-transform:uppercase;letter-spacing:.5px;font-size:11px;font-weight:600}.sidebar-item{align-items:center;gap:var(--space-sm);padding:10px var(--space-lg);margin:2px var(--space-sm);border-radius:var(--radius-sm);color:var(--sidebar-text);cursor:pointer;transition:all var(--transition-fast);font-size:13px;display:flex;position:relative}.sidebar-item:hover{background:var(--sidebar-hover-bg);color:var(--color-text)}.sidebar-item.active{background:var(--sidebar-active-bg);color:var(--sidebar-text-active);font-weight:600}.sidebar-item-icon{flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;display:flex}.sidebar-item-icon svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.sidebar-badge{border-radius:var(--radius-full);background:var(--color-danger);color:#fff;justify-content:center;align-items:center;min-width:20px;height:20px;margin-left:auto;padding:0 6px;font-size:11px;font-weight:600;display:flex}.sidebar-footer{height:var(--sidebar-footer-height);border-top:1px solid var(--color-border);padding:0 var(--space-md);align-items:center;gap:var(--space-sm);flex-shrink:0;display:flex}.sidebar-footer-avatar{border-radius:var(--radius-full);background:var(--color-primary-lighter);width:32px;height:32px;color:var(--color-primary);flex-shrink:0;justify-content:center;align-items:center;font-size:12px;font-weight:600;display:flex}.sidebar-footer-info{flex:1;min-width:0}.sidebar-footer-name{color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:600;overflow:hidden}.sidebar-footer-role{color:var(--color-text-placeholder);font-size:11px}.main{margin-left:var(--sidebar-width);flex-direction:column;flex:1;min-height:100vh;display:flex}.header{height:var(--header-height);background:var(--color-white);border-bottom:1px solid var(--color-border);padding:0 var(--space-lg);z-index:50;flex-shrink:0;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.header-left,.header-right{align-items:center;gap:var(--space-md);display:flex}.breadcrumb{align-items:center;gap:var(--space-sm);color:var(--color-text-secondary);font-size:13px;display:flex}.breadcrumb-item{cursor:pointer}.breadcrumb-item:hover{color:var(--color-primary)}.breadcrumb-separator{color:var(--color-text-placeholder);font-size:11px}.breadcrumb-current{color:var(--color-text);font-weight:600}.header-action{border-radius:var(--radius-sm);width:36px;height:36px;color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:flex;position:relative}.header-action:hover{background:var(--color-bg);color:var(--color-text)}.header-action svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.header-notification-badge{border-radius:var(--radius-full);background:var(--color-danger);border:2px solid #fff;width:8px;height:8px;position:absolute;top:6px;right:6px}.content{padding:var(--space-lg);flex:1}.card{background:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-border)}.card-header{padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.card-body{padding:var(--space-lg)}.card-footer{padding:var(--space-md) var(--space-lg);border-top:1px solid var(--color-border)}.stats-grid{gap:var(--space-lg);margin-bottom:var(--space-lg);grid-template-columns:repeat(auto-fill,minmax(220px,1fr));display:grid}.stat-card{background:var(--color-white);border-radius:var(--radius-lg);padding:var(--space-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);justify-content:space-between;align-items:flex-start;gap:var(--space-md);cursor:pointer;transition:all var(--transition-fast);display:flex}.stat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.stat-card-info{min-width:0}.stat-card-label{color:var(--color-text-secondary);margin-bottom:var(--space-xs);font-size:13px}.stat-card-value{color:var(--color-text);font-size:28px;font-weight:700;line-height:1.2}.stat-card-change{margin-top:var(--space-xs);align-items:center;gap:var(--space-xs);font-size:12px;display:flex}.stat-card-change.up{color:var(--color-success)}.stat-card-change.down{color:var(--color-danger)}.stat-card-icon{border-radius:var(--radius-md);flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.stat-card-icon svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px}.stat-card-icon--primary{background:var(--color-primary-lighter);color:var(--color-primary)}.stat-card-icon--success{background:var(--color-success-light);color:var(--color-success)}.stat-card-icon--warning{background:var(--color-warning-light);color:var(--color-warning)}.stat-card-icon--danger{background:var(--color-danger-light);color:var(--color-danger)}.stat-card-icon--info{background:var(--color-info-light);color:var(--color-info)}.btn{justify-content:center;align-items:center;gap:var(--space-sm);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:1px solid #0000;padding:8px 16px;font-family:inherit;font-size:13px;font-weight:500;line-height:1.5;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.btn--primary:hover:not(:disabled){background:var(--color-primary-dark)}.btn--success{background:var(--color-success);color:#fff;border-color:var(--color-success)}.btn--success:hover:not(:disabled){background:#16a34a}.btn--danger{color:var(--color-danger);border-color:var(--color-border);background:#fff}.btn--danger:hover:not(:disabled){background:var(--color-danger-light);border-color:var(--color-danger)}.btn--ghost{color:var(--color-text-secondary);background:0 0}.btn--ghost:hover:not(:disabled){background:var(--color-bg);color:var(--color-text)}.btn--outline{color:var(--color-primary);border-color:var(--color-primary);background:#fff}.btn--outline:hover:not(:disabled){background:var(--color-primary-lighter)}.btn--sm{padding:4px 10px;font-size:12px}.btn--lg{padding:12px 24px;font-size:15px}.btn--full{width:100%}.btn--icon{width:36px;height:36px;padding:0}.btn-group{gap:var(--space-sm);display:flex}.table-wrapper{overflow-x:auto}.table{border-collapse:collapse;width:100%}.table th{text-align:left;padding:12px var(--space-md);color:var(--color-text-secondary);background:var(--color-bg);border-bottom:1px solid var(--color-border);white-space:nowrap;font-size:12px;font-weight:600}.table td{padding:12px var(--space-md);border-bottom:1px solid var(--color-border-light);color:var(--color-text);font-size:13px}.table tbody tr{transition:background var(--transition-fast)}.table tbody tr:hover{background:#fafbfc}.table tbody tr:last-child td{border-bottom:none}.table-actions{gap:var(--space-sm);align-items:center;display:flex}.badge{white-space:nowrap;border-radius:var(--radius-full);align-items:center;padding:2px 10px;font-size:12px;font-weight:500;line-height:1.6;display:inline-flex}.badge--success{background:var(--color-success-light);color:#15803d}.badge--warning{background:var(--color-warning-light);color:#a16207}.badge--danger{background:var(--color-danger-light);color:#b91c1c}.badge--info{background:var(--color-info-light);color:#1d4ed8}.badge--primary{background:var(--color-primary-lighter);color:var(--color-primary)}.badge--gray{color:#4b5563;background:#f3f4f6}.tag{border-radius:var(--radius-sm);background:var(--color-bg);color:var(--color-text-secondary);border:1px solid var(--color-border);align-items:center;padding:2px 8px;font-size:12px;font-weight:500;line-height:1.6;display:inline-flex}.form-group{margin-bottom:var(--space-lg)}.form-label{color:var(--color-text);margin-bottom:var(--space-sm);font-size:13px;font-weight:600;display:block}.form-label--required:after{content:"*";color:var(--color-danger);margin-left:var(--space-xs)}.form-input,.form-select,.form-textarea{border:1px solid var(--color-border);border-radius:var(--radius-sm);width:100%;color:var(--color-text);transition:all var(--transition-fast);background:#fff;padding:8px 12px;font-family:inherit;font-size:13px;line-height:1.5}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #4f6ef71a}.form-input::placeholder,.form-textarea::placeholder{color:var(--color-text-placeholder)}.form-textarea{resize:vertical;min-height:80px}.form-hint{color:var(--color-text-placeholder);margin-top:var(--space-xs);font-size:12px}.form-radio-group{gap:var(--space-md);flex-wrap:wrap;display:flex}.form-radio-card{border:2px solid var(--color-border);border-radius:var(--radius-md);min-width:200px;padding:var(--space-lg);cursor:pointer;transition:all var(--transition-fast);align-items:flex-start;gap:var(--space-md);flex:1;display:flex}.form-radio-card:hover{border-color:var(--color-primary-light)}.form-radio-card.selected{border-color:var(--color-primary);background:var(--color-primary-lighter)}.form-radio-icon{border-radius:var(--radius-full);border:2px solid var(--color-border);width:24px;height:24px;transition:all var(--transition-fast);flex-shrink:0;justify-content:center;align-items:center;margin-top:2px;display:flex}.form-radio-card.selected .form-radio-icon{border-color:var(--color-primary);background:var(--color-primary)}.form-radio-card.selected .form-radio-icon:after{content:"";border-radius:var(--radius-full);background:#fff;width:8px;height:8px}.form-radio-info{min-width:0}.form-radio-title{color:var(--color-text);margin-bottom:2px;font-size:14px;font-weight:600}.form-radio-desc{color:var(--color-text-secondary);font-size:12px}.toolbar{justify-content:space-between;align-items:center;gap:var(--space-md);margin-bottom:var(--space-lg);flex-wrap:wrap;display:flex}.toolbar-left{align-items:center;gap:var(--space-md);flex:1;min-width:0;display:flex}.search-input{min-width:240px;position:relative}.search-input input{padding-left:36px}.search-input svg{fill:none;width:16px;height:16px;stroke:var(--color-text-placeholder);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.toolbar-filters{gap:var(--space-sm);display:flex}.filter-select{min-width:120px}.toolbar-right{gap:var(--space-sm);align-items:center;display:flex}.tabs{border-bottom:1px solid var(--color-border);margin-bottom:var(--space-lg);gap:0;display:flex}.tab-item{padding:12px var(--space-md);color:var(--color-text-secondary);cursor:pointer;transition:color var(--transition-fast);white-space:nowrap;font-size:14px;position:relative}.tab-item:hover{color:var(--color-text)}.tab-item.active{color:var(--color-primary);font-weight:600}.tab-item.active:after{content:"";background:var(--color-primary);border-radius:1px 1px 0 0;height:2px;position:absolute;bottom:-1px;left:0;right:0}.tab-item .tab-count{margin-left:var(--space-xs);color:var(--color-text-placeholder);font-size:11px}.tab-item.active .tab-count{color:var(--color-primary)}.pagination{padding:var(--space-md) 0;margin-top:var(--space-md);justify-content:space-between;align-items:center;display:flex}.pagination-info{color:var(--color-text-secondary);font-size:13px}.pagination-pages{gap:var(--space-xs);display:flex}.pagination-btn{min-width:32px;height:32px;padding:0 var(--space-sm);border-radius:var(--radius-sm);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;font-family:inherit;font-size:13px;display:flex}.pagination-btn:hover{background:var(--color-bg);color:var(--color-text)}.pagination-btn.active{background:var(--color-primary);color:#fff;font-weight:600}.pagination-btn:disabled{opacity:.4;cursor:not-allowed}.modal-overlay{z-index:1000;opacity:0;pointer-events:none;transition:opacity var(--transition-normal);background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-overlay.show{opacity:1;pointer-events:auto}.modal{background:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);width:560px;max-width:90vw;max-height:85vh;transition:transform var(--transition-normal);overflow-y:auto;transform:translateY(10px)}.modal-overlay.show .modal{transform:translateY(0)}.modal-header{padding:var(--space-lg);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.modal-title{font-size:16px;font-weight:600}.modal-close{border-radius:var(--radius-sm);width:32px;height:32px;color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;font-family:inherit;font-size:18px;display:flex}.modal-close:hover{background:var(--color-bg);color:var(--color-text)}.modal-body{padding:var(--space-lg)}.modal-footer{padding:var(--space-md) var(--space-lg);border-top:1px solid var(--color-border);justify-content:flex-end;gap:var(--space-sm);display:flex}.dialog-icon{border-radius:var(--radius-full);flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.dialog-icon--info{background:var(--color-primary-lighter);color:var(--color-primary)}.dialog-icon--warning{color:#d97706;background:#fef3c7}.dialog-icon--error{color:#dc2626;background:#fee2e2}.dialog-icon--success{color:#16a34a;background:#dcfce7}.avatar{border-radius:var(--radius-full);color:#fff;flex-shrink:0;justify-content:center;align-items:center;font-weight:600;display:inline-flex}.avatar--sm{width:28px;height:28px;font-size:11px}.avatar--md{width:32px;height:32px;font-size:12px}.avatar--lg{width:40px;height:40px;font-size:14px}.avatar--xl{width:48px;height:48px;font-size:16px}.avatar--primary{background:var(--color-primary)}.avatar--success{background:var(--color-success)}.avatar--warning{background:var(--color-warning)}.empty-state{text-align:center;padding:var(--space-2xl);color:var(--color-text-placeholder)}.empty-state-icon{width:64px;height:64px;margin:0 auto var(--space-md);opacity:.4}.empty-state-title{color:var(--color-text-secondary);margin-bottom:var(--space-xs);font-size:14px;font-weight:600}.empty-state-desc{margin-bottom:var(--space-lg);font-size:13px}.page-header{margin-bottom:var(--space-lg)}.page-header-title{margin-bottom:var(--space-xs);font-size:20px;font-weight:600}.page-header-desc{color:var(--color-text-secondary);font-size:13px}.grid{gap:var(--space-lg);display:grid}.grid--2{grid-template-columns:repeat(2,1fr)}.grid--3{grid-template-columns:repeat(3,1fr)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mb-sm{margin-bottom:var(--space-sm)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.w-full{width:100%}.login-container{border-radius:var(--radius-xl);width:900px;max-width:95vw;box-shadow:var(--shadow-xl);display:flex;overflow:hidden}.login-side{width:400px;padding:var(--space-2xl);color:#fff;background:linear-gradient(135deg,#4f6ef7 0%,#7c3aed 100%);flex-direction:column;justify-content:center;display:flex}.login-side h1{color:#fff;margin-bottom:var(--space-md);font-size:28px}.login-side p{opacity:.85;font-size:14px;line-height:1.7}.login-side-features{margin-top:var(--space-lg)}.login-side-feature{align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md);opacity:.9;font-size:13px;display:flex}.login-side-feature-icon{border-radius:var(--radius-sm);background:#fff3;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;display:flex}.login-form-side{padding:var(--space-2xl);background:#fff;flex-direction:column;flex:1;justify-content:center;display:flex}.login-form-title{margin-bottom:var(--space-xs);font-size:20px;font-weight:600}.login-form-subtitle{color:var(--color-text-secondary);margin-bottom:var(--space-lg);font-size:13px}.login-form .form-group:last-child{margin-bottom:0}.section-title{color:var(--color-text);margin-bottom:var(--space-md);padding-bottom:var(--space-sm);border-bottom:1px solid var(--color-border-light);font-size:15px;font-weight:600}.detail-grid{gap:var(--space-sm) var(--space-md);margin-bottom:var(--space-lg);grid-template-columns:120px 1fr;display:grid}.detail-label{color:var(--color-text-secondary);text-align:right;padding-top:2px;font-size:13px}.detail-value{color:var(--color-text);font-size:13px}.project-card{border-radius:var(--radius-lg);border:1px solid var(--color-border);box-shadow:var(--shadow-sm);padding:var(--space-lg);transition:all var(--transition-fast);background:#fff}.project-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.project-card-header{margin-bottom:var(--space-md);justify-content:space-between;align-items:flex-start;display:flex}.project-card-title{color:var(--color-text);margin-bottom:var(--space-xs);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:15px;font-weight:600;display:-webkit-box;overflow:hidden}.project-card-meta{color:var(--color-text-secondary);font-size:12px}.project-card-desc{color:var(--color-text-secondary);margin-bottom:var(--space-md);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;display:-webkit-box;overflow:hidden}.project-card-footer{padding-top:var(--space-md);border-top:1px solid var(--color-border-light);justify-content:space-between;align-items:center;display:flex}.project-card-avatars{display:flex}.project-card-avatars .avatar{border:2px solid #fff;margin-left:-8px}.project-card-avatars .avatar:first-child{margin-left:0}.project-card-count{color:var(--color-text-secondary);font-size:12px}.task-preview{padding:var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--space-sm);transition:all var(--transition-fast);cursor:pointer}.task-preview:hover{border-color:var(--color-primary-light);background:#fafbff}.task-preview-header{align-items:center;gap:var(--space-sm);margin-bottom:var(--space-xs);display:flex}.task-preview-title{color:var(--color-text);font-size:14px;font-weight:600}.task-preview-meta{gap:var(--space-md);color:var(--color-text-secondary);font-size:12px;display:flex}.upload-area{border:2px dashed var(--color-border);border-radius:var(--radius-md);padding:var(--space-xl);text-align:center;cursor:pointer;transition:all var(--transition-fast)}.upload-area:hover{border-color:var(--color-primary-light);background:var(--color-primary-lighter)}.upload-area-icon{color:var(--color-text-placeholder);margin-bottom:var(--space-sm);font-size:32px}.upload-area-text{color:var(--color-text-secondary);font-size:13px}.upload-area-text span{color:var(--color-primary);font-weight:600}.timeline{padding-left:24px;position:relative}.timeline:before{content:"";background:var(--color-border);width:2px;position:absolute;top:4px;bottom:4px;left:7px}.timeline-item{padding-bottom:var(--space-lg);position:relative}.timeline-item:last-child{padding-bottom:0}.timeline-dot{border-radius:var(--radius-full);background:var(--color-border);border:2px solid #fff;width:16px;height:16px;position:absolute;top:4px;left:-24px}.timeline-dot--active{background:var(--color-primary)}.timeline-dot--success{background:var(--color-success)}.divider{background:var(--color-border);height:1px;margin:var(--space-lg) 0}.divider--horizontal{width:1px;height:auto}