/* ===== Roster / class tables ===== */
.cop-roster-actions { margin-bottom: 8px; }
.cop-roster-actions .cop-secondary { background: #f4f3f0; border: none; border-radius: 8px; padding: 6px 14px; font-size: 13px; cursor: pointer; }
.cop-roster-actions .cop-secondary:hover { background: #e6e4df; }

.cop-roster-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.cop-roster-table th { text-align: left; font-weight: 700; color: #6f6d68; padding: 8px 12px; border-bottom: 2px solid #e6e4df; font-size: 12px; white-space: nowrap; }
.cop-roster-table td { padding: 10px 12px; border-bottom: 1px solid #f0efea; vertical-align: middle; }
.cop-roster-table tbody tr:last-child td { border-bottom: none; }
.cop-roster-table tbody tr:hover td { background: #f6f5f2; }
.cop-roster-table-wrap { overflow-x: auto; border: 1px solid #e6e4df; border-radius: 10px; background: #fff; }

/* ===== Report cards ===== */
.cop-report-card { border: 1px solid #e6e4df; border-radius: 14px; background: #fff; padding: 16px; text-align: center; box-shadow: 0 10px 24px rgba(31,31,29,.04); }
.cop-report-card .report-value,
.cop-report-value { font-size: 32px; font-weight: 800; color: #1f1f1d; line-height: 1; }
.cop-report-card .report-delta,
.cop-report-delta { font-size: 13px; margin: 4px 0; font-weight: 600; display:inline-block; }
.cop-report-card .report-delta.up,
.cop-report-delta.up { color: #16a34a; }
.cop-report-card .report-delta.down,
.cop-report-delta.down { color: #dc2626; }
.cop-report-card .report-label,
.cop-report-label { color: #6f6d68; font-size: 13px; margin-top: 4px; }

/* ===== Analytics dashboard cards ===== */
.cop-analytics-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 16px; }
.cop-analytic-card { background: #fff; border: 1px solid #e6e4df; border-radius: 14px; padding: 18px 16px 14px; box-shadow: 0 6px 16px rgba(31,31,29,.04); display: flex; flex-direction: column; gap: 6px; }
.cop-analytic-card-header { display: flex; align-items: center; gap: 8px; }
.cop-analytic-rank { font-size: 11px; font-weight: 700; color: #b0ada5; letter-spacing: 1px; }
.cop-analytic-label { font-size: 13px; font-weight: 600; color: #6f6d68; }
.cop-analytic-value { font-size: 34px; font-weight: 800; color: #1f1f1d; line-height: 1.1; letter-spacing: -0.5px; }
.cop-analytic-bar-wrap { margin: 2px 0; }
.cop-analytic-bar-bg { background: #f0efea; border-radius: 5px; height: 8px; overflow: hidden; }
.cop-analytic-bar-fill { height: 8px; border-radius: 5px; background: linear-gradient(90deg, #0F7B6C, #1a9b8a); transition: width .5s ease; }
.cop-analytic-footer { display: flex; align-items: center; gap: 10px; margin-top: 2px; }
.cop-analytic-delta { font-size: 12px; font-weight: 700; }
.cop-analytic-delta.up { color: #16a34a; }
.cop-analytic-delta.down { color: #dc2626; }
.cop-analytic-sub { font-size: 11px; color: #b0ada5; }
@media (max-width: 820px) { .cop-analytics-cards { grid-template-columns: 1fr; } }

/* ===== Heatmap ===== */
.cop-heatmap-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.cop-heatmap-table th, .cop-heatmap-table td { padding: 6px 8px; text-align: center; border: 1px solid #f0efea; }
.cop-heatmap-table th { color: #6f6d68; font-weight: 700; background: #f9f8f5; font-size: 11px; }
.cop-heatmap-table td { min-width: 28px; }

/* ===== Capability cards (empty state guidance) ===== */
.cop-cap-card-list { display: flex; flex-wrap: wrap; gap: 10px; }
.cop-cap-card { border: 1px solid #e6e4df; border-radius: 12px; background: #fff; padding: 14px 16px; flex: 1 1 200px; max-width: 260px; box-shadow: 0 4px 12px rgba(31,31,29,.03); }

/* ===== Reports ===== */
.cop-reports-tab-content { margin-top: 8px; }
.cop-grid-three { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 6px; }
@media (max-width: 640px) { .cop-grid-three { grid-template-columns: 1fr; } }
/* ===== Heatmap v1.3 toolbar ===== */
.cop-heatmap-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; flex-wrap:wrap; gap:8px; }
.cop-heatmap-header h3 { margin:0; font-size:14px; font-weight:700; color:#3a3935; }
.cop-heatmap-toolbar { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.cop-heatmap-filter { border:1px solid #e6e4df; border-radius:8px; padding:5px 10px; font-size:12px; background:#fff; color:#3a3935; cursor:pointer; outline:none; }
.cop-heatmap-filter:focus { border-color:#0F7B6C; }
.cop-btn-icon { border:1px solid #e6e4df; border-radius:8px; padding:5px 12px; font-size:12px; background:#fff; color:#0F7B6C; cursor:pointer; font-weight:600; white-space:nowrap; }
.cop-btn-icon:hover { background:#f0faf8; border-color:#0F7B6C; }

/* ===== Heatmap table (replacing canvas) ===== */
.cop-heatmap-wrap { overflow-x:auto; border:1px solid #e6e4df; border-radius:10px; max-height:420px; overflow-y:auto; }
.cop-heatmap-tbl { border-collapse:collapse; font-size:12px; min-width:100%; }
.cop-heatmap-tbl thead { position:sticky; top:0; z-index:4; }
.cop-heatmap-tbl th { background:#f9f8f5; color:#6f6d68; font-weight:700; padding:7px 10px; border:1px solid #e6e4df; white-space:nowrap; cursor:pointer; user-select:none; }
.cop-heatmap-tbl th:first-child { position:sticky; left:0; z-index:5; background:#f9f8f5; }
.cop-heatmap-tbl th .cop-sort-icon { margin-left:4px; opacity:.4; }
.cop-heatmap-tbl th.sorted-asc .cop-sort-icon::after { content:"↑"; opacity:1; }
.cop-heatmap-tbl th.sorted-desc .cop-sort-icon::after { content:"↓"; opacity:1; }
.cop-heatmap-tbl td { padding:6px 8px; text-align:center; border:1px solid #f0efea; font-size:11px; min-width:60px; }
.cop-heatmap-tbl td:first-child { position:sticky; left:0; background:#f9f8f5; font-weight:600; color:#3a3935; text-align:left; padding-left:10px; z-index:1; border-right:1px solid #e6e4df; white-space:nowrap; min-width:80px; }
.cop-heatmap-tbl tr:hover td { filter:brightness(.96); }

/* 5档色阶 */
.cop-hm-0 { background:#f4f3f0; color:#b0ada5; }
.cop-hm-1 { background:#d4ede8; color:#1f1f1d; }
.cop-hm-2 { background:#9ed4ca; color:#1f1f1d; }
.cop-hm-3 { background:#4daa9e; color:#fff; }
.cop-hm-4 { background:#0F7B6C; color:#fff; font-weight:600; }

/* 图例 */
.cop-heatmap-legend { display:flex; align-items:center; gap:8px; margin-top:8px; font-size:11px; color:#b0ada5; }
.cop-heatmap-legend-bar { flex:1; height:8px; border-radius:4px; background:linear-gradient(90deg,#f4f3f0,#d4ede8,#9ed4ca,#4daa9e,#0F7B6C); }