/* ================= 基础变量与重置 ================= */
        
        .page-header {display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 20px; flex-shrink: 0;}
        .page-title h2 {margin: 0 0 5px 0; font-size: 22px; font-weight: 600;}
        .page-title p {margin: 0; color: var(--text-muted); font-size: 13px;}
        .action-buttons {display: flex; gap: 10px;}
        .layui-btn-primary {background: #fff; border-radius: 6px;}
        .layui-btn-normal {border-radius: 6px; background: var(--primary-color);}
        /* 任务管理布局 */
        .task-layout {display: flex; flex-direction: column; flex: 1; overflow: hidden;}
        /* 工具栏 (视图切换等) */
        .task-toolbar {display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; flex-shrink: 0;
            gap: 12px; flex-wrap: nowrap;}
        .view-switcher {flex-shrink: 0;}
        .view-switcher .layui-btn-group {display: flex; flex-wrap: nowrap;}
        .view-switcher .layui-btn-group .layui-btn {border-radius: 6px; font-size: 13px; border-color: var(--border-color);
            white-space: nowrap; flex-shrink: 0;}
        .view-switcher .layui-btn-group .layui-btn.layui-btn-normal {background: var(--primary-color); color: white; border-color: var(--primary-color);}
        .filter-group {display: flex; gap: 8px; align-items: center; font-size: 13px; flex-wrap: nowrap; flex-shrink: 0;}
        .filter-group select {height: 30px; border-radius: 6px; border: 1px solid var(--border-color); padding: 0 8px;
            outline: none; background: #fff; font-size: 12px; max-width: 108px;}
        /* 看板视图 */
        .kanban-board {display: flex; gap: 15px; overflow-x: auto; flex: 1; padding-bottom: 10px;
            align-items: flex-start;}
        .kanban-col {width: 300px; flex-shrink: 0; background: #f1f5f9; border-radius: 10px; padding: 15px;
            display: flex; flex-direction: column; max-height: 100%; position: relative;
            box-sizing: border-box;}   /* max-height:100% 必须含 padding，否则列会高出容器、底部提示条被裁 */
        .kanban-col-header {display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; font-weight: 600; font-size: 14px;}
        .kanban-col-header .count {background: #e2e8f0; color: #475569; font-size: 12px; padding: 2px 8px; border-radius: 10px;}
        .kanban-tasks {overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 10px; padding-right: 2px;}
        /* 内容超出时给个底部渐隐提示，避免最后一张卡被裁掉却看不出可滚动 */
        .kanban-tasks.is-scrollable {box-shadow: inset 0 -18px 14px -14px rgba(15, 23, 42, .35);}
        /* 列内还有卡片被裁在可视区外时，底部给一条明确可点的提示（列头计数与可见卡片不一致时最容易误解） */
        .kanban-more {position: absolute; left: 15px; right: 15px; bottom: 8px; height: 24px; line-height: 24px;
            text-align: center; font-size: 12px; color: #4f46e5; background: rgba(255,255,255,.97);
            border: 1px solid #c7d2fe; border-radius: 12px; cursor: pointer; z-index: 2;
            box-shadow: 0 2px 6px rgba(15,23,42,.10); user-select: none;}
        .kanban-more:hover {background: #eef2ff;}
        /* 新建/更新后自动定位到的卡片，闪一下，避免「保存成功了却找不到」 */
        .task-card.is-new {border-color: var(--primary-color); animation: cardFlash 1.1s ease-in-out 2;}
        @keyframes cardFlash {
            0%, 100% {box-shadow: 0 0 0 3px rgba(79,70,229,.20);}
            50%      {box-shadow: 0 0 0 7px rgba(79,70,229,.08);}
        }
        /* 工具栏「共 N 条」，用于和接口返回条数核对 */
        .task-total {font-size: 12px; color: var(--text-muted); background: #fff; border: 1px solid var(--border-color);
            border-radius: 12px; padding: 3px 10px; white-space: nowrap; flex-shrink: 0;}
        /* 任务卡片 */
        .task-card {background: #fff; border-radius: 8px; padding: 15px; border: 1px solid var(--border-color);
            cursor: grab; transition: box-shadow 0.2s, border-color 0.2s;}
        .task-card:hover {box-shadow: 0 4px 12px rgba(0,0,0,0.05); border-color: #cbd5e1;}
        .task-card.ai-generated {border-left: 3px solid var(--primary-color); background: #f8fafc;}
        .task-card-top {display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 10px;}
        .task-tag {font-size: 11px; padding: 2px 6px; border-radius: 4px; font-weight: 500;}
        .tag-high {background: #fee2e2; color: #ef4444;}
        .tag-mid {background: #fef3c7; color: #d97706;}
        .tag-low {background: #e0f2fe; color: #0284c7;}
        .tag-ai {background: #e0e7ff; color: #4f46e5; display: flex; align-items: center; gap: 3px;}
        .task-title {font-size: 14px; font-weight: 500; color: #1f2937; line-height: 1.4; margin-bottom: 10px;}
        .task-desc {font-size: 12px; color: var(--text-muted); line-height: 1.5; margin-bottom: 15px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
        .task-card-footer {display: flex; justify-content: space-between; align-items: center; border-top: 1px dashed #e5e7eb; padding-top: 10px;}
        .task-meta {display: flex; align-items: center; gap: 10px; font-size: 12px; color: #9ca3af;}
        .task-assignee {width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 11px;}
        /* --- 右侧边栏 --- */
        .sidebar-right {width: 320px; padding: 20px 20px 20px 0; overflow-y: auto; flex-shrink: 0;}
        .right-card {background: #fff; border-radius: 10px; border: 1px solid var(--border-color);
            padding: 15px; margin-bottom: 20px;}
        .right-card-header {display: flex; justify-content: space-between; align-items: center; font-weight: 600; font-size: 14px; margin-bottom: 15px;}
        .right-card-header a {font-size: 12px; color: var(--text-muted); font-weight: normal; text-decoration: none; cursor: pointer;}
        /* 今日待办列表 */
        .todo-list {list-style: none; padding: 0; margin: 0;}
        .todo-item {display: flex; align-items: flex-start; gap: 10px; padding: 10px 0; border-bottom: 1px dashed #f3f4f6;}
        .todo-item:last-child {border-bottom: none;}
        .todo-checkbox {margin-top: 3px; width: 16px; height: 16px; border-radius: 4px; border: 1px solid #d1d5db; cursor: pointer; accent-color: var(--primary-color);}
        .todo-content {flex: 1;}
        .todo-title {font-size: 13px; font-weight: 500; margin-bottom: 4px;}
        .todo-time {font-size: 12px; color: var(--text-muted); display: flex; align-items: center; gap: 5px;}
        .todo-time.overdue {color: #ef4444;}
        /* 数据统计 */
        .stats-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 10px;}
        .stat-box {background: #f9fafb; border-radius: 8px; padding: 12px; text-align: center; border: 1px solid var(--border-color);}
        .stat-value {font-size: 20px; font-weight: 700; color: var(--primary-color); margin-bottom: 4px;}
        .stat-label {font-size: 12px; color: var(--text-muted);}
        /* 悬浮AI按钮 */
        .float-ai-btn {position: fixed; bottom: 30px; right: 30px; background: var(--primary-color); color: #fff;
            border-radius: 25px; padding: 10px 20px; box-shadow: 0 4px 12px rgba(59, 89, 152, 0.3);
            display: flex; align-items: center; gap: 8px; cursor: pointer; z-index: 1000; transition: transform 0.2s;}
        .float-ai-btn:hover {transform: translateY(-2px);}
        .bg-purple {background: #8b5cf6;}
        .bg-red {background: #ef4444;}
        .bg-green {background: #10b981;}
        .bg-orange {background: #f59e0b;}
        .bg-gray {background: #6b7280;}

        /* ==== 页面级覆盖/补遗（自 demo 原样恢复，优先于共享样式） ==== */
        .main-content {flex: 1; display: flex; flex-direction: column; overflow: hidden; padding: 20px;}

        /* ==== 任务卡片：标签 ==== */
        .task-tags {display: flex; flex-wrap: wrap; gap: 6px; margin: -4px 0 10px;}
        .task-tag-item {font-size: 11px; line-height: 18px; color: #4b5563; background: #f3f4f6;
            border-radius: 4px; padding: 1px 6px;}

        /* ==== 任务详情弹窗 ==== */
        .task-detail {height: 100%; box-sizing: border-box; overflow-y: auto;}
        .detail-meta {display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px;}
        .detail-pill {font-size: 11px; line-height: 20px; padding: 0 8px; border-radius: 10px;
            background: #eef2f7; color: #475569;}
        .detail-pill.is-high {background: #fee2e2; color: #ef4444;}
        .detail-pill.is-danger {background: #fff1f2; color: #e11d48;}
        .detail-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; font-size: 12px;
            color: #374151; background: #f9fafb; border: 1px solid var(--border-color);
            border-radius: 8px; padding: 12px; margin-bottom: 14px;}
        .detail-grid > div > span {display: block; color: #9ca3af; font-size: 11px; margin-bottom: 2px;}
        .detail-block-title {font-size: 12px; font-weight: 600; color: #6b7280; margin: 0 0 6px;}
        .detail-progress {height: 6px; background: #e5e7eb; border-radius: 3px; overflow: hidden; margin-bottom: 12px;}
        .detail-progress > i {display: block; height: 100%; background: var(--primary-color); border-radius: 3px;
            transition: width .3s;}
        .detail-members {font-size: 12px; color: #374151; margin-bottom: 12px;}
        .detail-members > span {display: inline-block; color: #9ca3af; font-size: 11px; margin-right: 6px;}
        .detail-desc {font-size: 13px; color: #4b5563; line-height: 1.7; white-space: pre-wrap;
            background: #fff; border: 1px solid var(--border-color); border-radius: 8px; padding: 10px 12px;
            margin-bottom: 4px;}

        /* ==== 新建 / 编辑任务弹窗 ==== */
        .task-form {height: 100%; box-sizing: border-box; overflow-y: auto; padding: 16px 20px 8px;}
        .tf-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px;}
        .tf-grid-3 {grid-template-columns: 1fr 1fr 1fr;}
        .tf-item {margin-bottom: 10px; min-width: 0;}
        .tf-label {display: block; font-size: 12px; color: #6b7280; margin-bottom: 6px;}
        .tf-req {color: #ef4444; font-style: normal;}
        .tf-tip {color: #9ca3af; font-size: 11px; margin-left: 4px; font-weight: normal;}
        .tf-input {width: 100%; box-sizing: border-box; height: 34px; font-size: 13px; color: #1f2937;
            border: 1px solid var(--border-color); border-radius: 6px; padding: 0 10px; outline: none;
            background: #fff; transition: border-color .15s, box-shadow .15s;}
        .tf-input:focus {border-color: var(--primary-color); box-shadow: 0 0 0 3px rgba(59,89,152,.08);}
        .tf-textarea {width: 100%; box-sizing: border-box; height: 60px; font-size: 13px; line-height: 1.6;
            color: #1f2937; border: 1px solid var(--border-color); border-radius: 6px; padding: 8px 10px;
            outline: none; resize: vertical; background: #fff;}
        .tf-textarea:focus {border-color: var(--primary-color); box-shadow: 0 0 0 3px rgba(59,89,152,.08);}
        .tf-chips {display: flex; flex-wrap: wrap; gap: 8px;}
        .tf-chip {font-size: 12px; line-height: 24px; padding: 0 12px; border-radius: 14px;
            border: 1px solid var(--border-color); background: #fff; color: #4b5563; cursor: pointer;
            user-select: none; transition: all .15s;}
        .tf-chip:hover {border-color: #cbd5e1; background: #f9fafb;}
        .tf-chip.active {background: #eff6ff; border-color: var(--primary-color); color: var(--primary-color);
            font-weight: 500;}
        .tf-range {width: 100%; margin: 9px 0 0; accent-color: var(--primary-color); cursor: pointer;}
        .tf-members {display: flex; flex-wrap: wrap; gap: 8px; max-height: 70px; overflow-y: auto;
            border: 1px dashed var(--border-color); border-radius: 8px; padding: 8px;}
        .tf-member {display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 3px;
            border: 1px solid var(--border-color); border-radius: 16px; font-size: 12px; color: #4b5563;
            background: #fff; cursor: pointer; user-select: none; transition: all .15s;}
        .tf-member:hover {border-color: #cbd5e1;}
        .tf-member.active {border-color: var(--primary-color); background: #eff6ff; color: var(--primary-color);}
        .tf-avatar {width: 20px; height: 20px; border-radius: 50%; background: #cbd5e1; color: #fff;
            font-size: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0;}
        .tf-member.active .tf-avatar {background: var(--primary-color);}
        .tf-suggests {display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px;}
        .tf-suggest {font-size: 11px; line-height: 18px; color: #6b7280; background: #f3f4f6;
            border-radius: 10px; padding: 1px 8px; cursor: pointer; transition: all .15s;}
        .tf-suggest:hover {background: #e5e7eb; color: #374151;}
        .tf-counter {text-align: right; font-size: 11px; color: #9ca3af; margin-top: 4px;}
        .tf-empty {font-size: 12px; color: #9ca3af; padding: 4px 2px;}
        .tf-foot-tip {font-size: 11px; color: #9ca3af; line-height: 1.6; background: #f9fafb;
            border-radius: 6px; padding: 8px 10px; margin-top: 2px;}