page {
  background-color: #f3f3f3;
  line-height: 1.5;
}

view {
  line-height: inherit;
}

.page-loading,
.page-empty,
.page-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 60vh;
  gap: 24rpx;
}

.empty-text,
.error-text {
  font-size: 28rpx;
  color: #a6a6a6;
}

.error-text {
  color: #e34d59;
}

.retry-btn {
  margin-top: 16rpx;
  padding: 16rpx 48rpx;
  background: #0052d9;
  color: #ffffff;
  font-size: 28rpx;
  border-radius: 16rpx;
}

.retry-btn--hover {
  opacity: 0.8;
}

.banner-section {
  position: relative;
  width: 100%;
  overflow: hidden;
  height: 100%;
}

.banner-bg-img {
  position: absolute;
  top: -50rpx;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 0;
}

.banner-overlay {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 36rpx 40rpx;
}

.coach-header {
  display: flex;
  align-items: center;
  gap: 32rpx;
}

.avatar-box {
  width: 98rpx;
  height: 98rpx;
  border-radius: 32rpx;
  background: rgba(255, 255, 255, 0.2);
  overflow: hidden;
  flex-shrink: 0;
  box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.15);
}

.avatar-img {
  width: 100%;
  height: 100%;
}

.info-middle {
  flex: 1;
  min-width: 0;
}

.name-row {
  display: flex;
  align-items: center;
  gap: 14rpx;
  margin-bottom: 8rpx;
}

.coach-name {
  font-size: 32rpx;
  font-weight: 600;
  color: #ffffff;
}

.skill-row {
  display: flex;
  align-items: center;
  gap: 14rpx;
}

.skill-tag {
  padding: 4rpx 16rpx;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 8rpx;
  font-size: 22rpx;
  color: rgba(255, 255, 255, 0.9);
}

.info-right-stats {
  flex-shrink: 0;
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 12rpx;
  font-weight: 500;

  text-shadow:
    0 0 12rpx rgba(84, 5, 5, 0.856),
    0 0 2rpx rgba(84, 5, 5, 0.9);
}

.right-stat {
  display: flex;
  align-items: baseline;
  gap: 8rpx;
  justify-content: flex-end;
}

.right-stat-label {
  font-size: 22rpx;
  color: rgba(255, 255, 255);
}

.right-stat-value {
  font-size: 28rpx;
  font-weight: 700;
  color: #ffffff;
}

.main-content {
  padding: 28rpx;
  padding-bottom: 200rpx;
  display: flex;
  flex-direction: column;
  gap: 28rpx;
}

.card {
  background: #ffffff;
  border-radius: 32rpx;
  padding: 36rpx;
  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
}

.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 28rpx;
}

.section-title {
  font-size: 28rpx;
  font-weight: 600;
  color: #242424;
  position: relative;
  padding-left: 20rpx;
  margin-bottom: 28rpx;
}

.card-header .section-title {
  margin-bottom: 0;
}

.section-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6rpx;
  height: 28rpx;
  border-radius: 4rpx;
}

.title-blue::before {
  background: linear-gradient(180deg, #0052d9, #5b9cf8);
}

.title-green::before {
  background: linear-gradient(180deg, #00a870, #4cd964);
}

.title-orange::before {
  background: linear-gradient(180deg, #ed7b2f, #ffc107);
}

.title-pink::before {
  background: linear-gradient(180deg, #ec4899, #f472b6);
}

.title-purple::before {
  background: linear-gradient(180deg, #7c3aed, #a78bfa);
}

.title-teal::before {
  background: linear-gradient(180deg, #0d9488, #5eead4);
}

.header-hint {
  font-size: 22rpx;
  color: #a6a6a6;
}

.perf-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22rpx;
}

.perf-card {
  border-radius: 24rpx;
  padding: 22rpx;
  border: 2rpx solid transparent;
}

.perf-blue {
  background: linear-gradient(135deg, #eff6ff, #eef2ff);
  border-color: rgba(191, 219, 254, 0.5);
}

.perf-green {
  background: linear-gradient(135deg, #ecfdf5, #d1fae5);
  border-color: rgba(167, 243, 208, 0.5);
}

.perf-orange {
  background: linear-gradient(135deg, #fff7ed, #fef3c7);
  border-color: rgba(253, 186, 116, 0.5);
}

.perf-purple {
  background: linear-gradient(135deg, #faf5ff, #ede9fe);
  border-color: rgba(196, 181, 253, 0.5);
}

.perf-label {
  font-size: 24rpx;
  color: #000000;
  display: block;
  margin-bottom: 24rpx;
  font-weight: 500;
}

.perf-value-row {
  display: flex;
  align-items: baseline;
  gap: 4rpx;
}

.perf-value {
  font-size: 42rpx;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.perf-unit {
  font-size: 22rpx;
  color: #000000;
}

.perf-sub {
  font-size: 22rpx;
  color: #979797;
  display: block;
  margin-top: -8rpx;
}

.perf-progress-box {
  margin-top: 22rpx;
  background: #fafafa;
  border-radius: 24rpx;
  padding: 22rpx 22rpx 50rpx 22rpx;
}

.perf-progress-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18rpx;
}

.perf-progress-label {
  font-size: 24rpx;
  font-weight: 500;
  color: #5e5e5e;
}

.perf-progress-hint {
  font-size: 26rpx;
  font-weight: 500;
  color: #0052d9;
  font-weight: 500;
}

.perf-progress-bar {
  height: 12rpx;
  background: #e7e7e7;
  border-radius: 6rpx;
  overflow: hidden;
}

.perf-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #0052d9, #5b9cf8);
  border-radius: 6rpx;
  transition: width 0.3s ease;
}

.perf-progress-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10rpx;
}

.perf-progress-current,
.perf-progress-target {
  font-size: 22rpx;
  color: #c5c5c5;
}

.income-tabs {
  display: flex;
  align-items: center;
  gap: 8rpx;
}

.income-tab {
  display: flex;
  align-items: center;
  gap: 4rpx;
  font-size: 24rpx;
  padding: 8rpx 20rpx;
  border-radius: 100rpx;
  color: #8b8b8b;
  background: #f3f3f3;
}

.income-tab.active {
  color: #0052d9;
  background: #ecf2fe;
  font-weight: 500;
}

.income-tab--hover {
  opacity: 0.7;
}

.income-tab-est {
  font-size: 20rpx;
  color: #ed7b2f;
}

.income-list {
  display: flex;
  flex-direction: column;
  gap: 22rpx;
}

.income-item {
  display: flex;
  align-items: center;
  gap: 16rpx;
}

.income-dot {
  width: 14rpx;
  height: 14rpx;
  border-radius: 50%;
  flex-shrink: 0;
}

.dot-primary {
  background: #0052d9;
}

.dot-success {
  background: #00a870;
}

.dot-warning {
  background: #ed7b2f;
}

.dot-purple {
  background: #7c3aed;
}

.income-label {
  flex: 1;
  font-size: 28rpx;
  color: #5e5e5e;
}

.income-amount {
  font-size: 28rpx;
  font-weight: 700;
  color: #242424;
  font-variant-numeric: tabular-nums;
}

.income-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 20rpx;
  border-top: 2rpx solid #eeeeee;
}

.income-total-label {
  font-size: 28rpx;
  font-weight: 600;
  color: #5e5e5e;
}

.income-total-value {
  font-size: 28rpx;
  font-weight: 700;
  color: #00a870;
  font-variant-numeric: tabular-nums;
}

.task-summary {
  display: flex;
  align-items: center;
  gap: 16rpx;
  font-size: 24rpx;
}

.task-summary-label {
  font-weight: 700;
  color: #4b4b4b;
}

.task-summary-recall {
  color: #0052d9;
  font-weight: 700;
}

.task-summary-callback {
  color: #00a870;
  font-weight: 700;
}

.task-summary-num {
  font-size: 28rpx;
}

.task-list {
  display: flex;
  flex-direction: column;
  gap: 14rpx;
}

.task-list-extra {
  margin-top: 14rpx;
}

.task-item {
  display: flex;
  align-items: center;
  gap: 18rpx;
  padding: 18rpx;
  border-radius: 16rpx;
  border: 2rpx solid transparent;
}

.task-item-high-priority {
  background: rgba(254, 226, 226, 0.6);
  border-color: rgba(254, 202, 202, 0.6);
}

.task-item-priority {
  background: rgba(255, 237, 213, 0.4);
  border-color: rgba(253, 186, 116, 0.4);
}

.task-item-relationship {
  background: rgba(252, 231, 243, 0.4);
  border-color: rgba(249, 168, 212, 0.4);
}

.task-item-callback {
  background: rgba(204, 251, 241, 0.4);
  border-color: rgba(153, 246, 228, 0.4);
}

.task-item-abandoned {
  background: #fafafa;
  border-color: #eeeeee;
  opacity: 0.55;
}

.task-tag-text {
  font-size: 22rpx;
  font-weight: 500;
  flex-shrink: 0;
}

.task-tag-text.high-priority {
  color: #dc2626;
}

.task-tag-text.priority {
  color: #ea580c;
}

.task-tag-text.relationship {
  color: #db2777;
}

.task-tag-text.callback {
  color: #0d9488;
}

.task-customer-name {
  flex: 1;
  min-width: 0;
  font-size: 26rpx;
  color: #242424;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.task-note-btn {
  display: flex;
  align-items: center;
  gap: 4rpx;
  flex-shrink: 0;
}

.task-note-btn--hover {
  opacity: 0.6;
}

.task-note-count {
  font-size: 24rpx;
  font-weight: 500;
  color: #777777;
}

.task-pin {
  font-size: 28rpx;
  flex-shrink: 0;
}

.task-abandoned-name {
  flex: 1;
  min-width: 0;
  font-size: 24rpx;
  color: #c5c5c5;
  text-decoration: line-through;
}

.task-abandoned-reason {
  font-size: 20rpx;
  color: #c5c5c5;
  flex-shrink: 0;
}

.task-toggle {
  margin-top: 22rpx;
  text-align: center;
  font-size: 24rpx;
  color: #0052d9;
  font-weight: 500;
  padding: 12rpx 0;
}

.task-toggle--hover {
  opacity: 0.7;
}

.top5-list {
  display: flex;
  flex-direction: column;
  gap: 18rpx;
}

.top5-card {
  display: flex;
  align-items: center;
  gap: 22rpx;
  padding: 22rpx;
  border-radius: 24rpx;
  border: 2rpx solid transparent;
}

.top5-card--hover {
  opacity: 0.85;
}

.top5-card-pink {
  background: linear-gradient(135deg, rgba(252, 231, 243, 0.8), rgba(254, 205, 211, 0.4));
  border-color: rgba(249, 168, 212, 0.4);
}

.top5-card-amber {
  background: linear-gradient(135deg, rgba(254, 243, 199, 0.8), rgba(253, 230, 138, 0.4));
  border-color: rgba(252, 211, 77, 0.4);
}

.top5-card-gray {
  background: #fafafa;
  border-color: #f3f3f3;
}

.top5-avatar {
  width: 64rpx;
  height: 64rpx;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.top5-avatar.gradient-pink {
  background: linear-gradient(135deg, #f472b6, #e11d48);
}

.top5-avatar.gradient-amber {
  background: linear-gradient(135deg, #fbbf24, #f97316);
}

.top5-avatar.gradient-green {
  background: linear-gradient(135deg, #4ade80, #059669);
}

.top5-avatar.gradient-blue {
  background: linear-gradient(135deg, #60a5fa, #4f46e5);
}

.top5-avatar.gradient-purple {
  background: linear-gradient(135deg, #a78bfa, #7c3aed);
}

.top5-avatar-text {
  font-size: 22rpx;
  font-weight: 500;
  color: #ffffff;
}

.top5-info {
  flex: 1;
  min-width: 0;
}

.top5-name-row {
  display: flex;
  align-items: center;
  gap: 8rpx;
  margin-bottom: 8rpx;
}

.top5-name {
  font-size: 24rpx;
  font-weight: 600;
  color: #242424;
}

.top5-heart {
  font-size: 24rpx;
}

.top5-score {
  font-size: 24rpx;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.top5-score-success {
  color: #00a870;
}

.top5-score-warning {
  color: #ed7b2f;
}

.top5-score-gray {
  color: #8b8b8b;
}

.top5-stats {
  display: flex;
  align-items: center;
  gap: 28rpx;
}

.top5-stat {
  font-size: 22rpx;
  color: #a6a6a6;
}

.top5-stat-val {
  font-weight: 600;
  color: #393939;
}


/* ── 近期服务明细 ── */
.svc-list { display: flex; flex-direction: column; }
.svc-card {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding: 20rpx 0;
  border-bottom: 2rpx solid #f3f3f3;
}
.svc-card:last-child { border-bottom: none; }
.svc-card--hover { background: #f7f7f7; border-radius: 12rpx; }
.svc-content {
  flex: 1;
  margin-left: 20rpx;
  display: flex;
  flex-direction: column;
  gap: 2rpx;
}
.svc-row1 { display: flex; align-items: center; gap: 12rpx; }
.svc-customer { font-size: 28rpx; font-weight: 600; color: #242424; }
.svc-type {
  font-size: 22rpx;
  padding: 2rpx 12rpx;
  border-radius: 8rpx;
  background: rgba(0,0,0,0.06);
  color: #555;
}
.svc-type-basic     { background: rgba(0,82,217,0.10);  color: #0052d9; }
.svc-type-incentive { background: rgba(0,168,112,0.10); color: #00a870; }
.svc-date { margin-left: auto; font-size: 22rpx; color: #a6a6a6; }
.svc-row2 { display: flex; align-items: center; }
.svc-row2-left { flex: 1; display: flex; align-items: center; gap: 12rpx; }
.svc-table-tag {
  font-size: 22rpx;
  padding: 2rpx 12rpx;
  background: #ecf2fe;
  color: #0052d9;
  border-radius: 8rpx;
  font-weight: 500;
}
.svc-duration { font-size: 22rpx; color: #8b8b8b; }
.svc-perf     { font-size: 22rpx; color: #ed7b2f; }
.svc-income   { font-size: 28rpx; font-weight: 700; color: #242424; font-variant-numeric: tabular-nums; }
.svc-more     { margin-top: 24rpx; text-align: center; font-size: 24rpx; color: #0052d9; font-weight: 500; padding: 12rpx 0; }
.svc-more--hover { opacity: 0.7; }

.more-info-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 20rpx;
  border-bottom: 2rpx solid #f3f3f3;
  margin-bottom: 24rpx;
}

.more-info-label {
  font-size: 28rpx;
  color: #8b8b8b;
}

.more-info-value {
  font-size: 28rpx;
  color: #242424;
}

.history-table {
  overflow-x: auto;
}

.history-thead {
  display: flex;
  border-bottom: 2rpx solid #eeeeee;
  padding-bottom: 16rpx;
}

.history-th {
  text-align: center;
  font-size: 22rpx;
  color: #8b8b8b;
  font-weight: 500;
  flex-shrink: 0;
}

.history-th-left {
  text-align: left;
  width: 130rpx;
}

/* 服务客户 */
.history-th:nth-child(2) { width: 90rpx; }
/* 完成 回访/召回 */
.history-th:nth-child(3) { width: 160rpx; }
/* 业绩时长 */
.history-th:nth-child(4) { width: 120rpx; }
/* 工资 */
.history-th:nth-child(5) { width: 120rpx; }

.history-row {
  display: flex;
  padding: 20rpx 0;
  border-bottom: 2rpx solid #fafafa;
}

.history-row-current {
  background: rgba(0, 82, 217, 0.03);
  border-radius: 8rpx;
  padding: 20rpx 0rpx;
}

.history-td {
  text-align: center;
  font-size: 24rpx;
  color: #242424;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}

/* 服务客户 */
.history-td:nth-child(2) { width: 90rpx; }
/* 完成 回访/召回 */
.history-td:nth-child(3) { width: 160rpx; }
/* 业绩时长 */
.history-td:nth-child(4) { width: 120rpx; }
/* 工资 */
.history-td:nth-child(5) { width: 120rpx; }

.history-td-left {
  text-align: left;
  width: 130rpx;
  display: flex;
  align-items: center;
  gap: 8rpx;
  font-weight: 500;
}

.history-est {
  font-size: 20rpx;
  color: #ed7b2f;
}

.note-list {
  display: flex;
  flex-direction: column;
  gap: 20rpx;
}

.note-item {
  background: #fafafa;
  border-radius: 24rpx;
  border: 2rpx solid #e7e7e7;
  padding: 24rpx;
}

.note-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12rpx;
}

.note-author {
  font-size: 24rpx;
  font-weight: 500;
  color: #242424;
}

.note-time {
  font-size: 22rpx;
  color: #a6a6a6;
}

.note-content {
  font-size: 24rpx;
  color: #5e5e5e;
  line-height: 1.6;
}

.note-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 48rpx 0;
  gap: 16rpx;
}

.empty-hint {
  font-size: 24rpx;
  color: #c5c5c5;
}

.bottom-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 128rpx;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(20px);
  border-top: 2rpx solid #eeeeee;
  display: flex;
  align-items: center;
  gap: 24rpx;
  padding: 0 32rpx;
  z-index: 100;
}

.btn-chat {
  flex: 1;
  height: 88rpx;
  background: linear-gradient(135deg, #0052d9, #3b82f6);
  color: #ffffff;
  font-weight: 500;
  border-radius: 24rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12rpx;
  font-size: 28rpx;
  box-shadow: 0 8rpx 24rpx rgba(0, 82, 217, 0.3);
}

.btn-chat--hover {
  opacity: 0.85;
}

.btn-note {
  flex: 1;
  height: 88rpx;
  background: #f3f3f3;
  color: #242424;
  font-weight: 500;
  border-radius: 24rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12rpx;
  font-size: 28rpx;
}

.btn-note--hover {
  background: #e7e7e7;
}

.notes-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 200;
  display: flex;
  align-items: flex-end;
}

.notes-popup {
  width: 100%;
  background: #ffffff;
  border-radius: 48rpx 48rpx 0 0;
  padding: 40rpx;
  padding-bottom: 64rpx;
  max-height: 70vh;
  overflow-y: auto;
}

.notes-popup-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 32rpx;
}

.notes-popup-title {
  font-size: 32rpx;
  font-weight: 600;
  color: #242424;
}

.notes-popup-close {
  width: 64rpx;
  height: 64rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #f3f3f3;
}

.notes-popup-close--hover {
  background: #e7e7e7;
}

.notes-popup-list {
  display: flex;
  flex-direction: column;
  gap: 20rpx;
}

.notes-popup-item {
  padding: 28rpx;
  background: #fafafa;
  border-radius: 24rpx;
  border: 2rpx solid #f3f3f3;
}

.notes-popup-item-top {
  display: flex;
  align-items: center;
  gap: 8rpx;
  margin-bottom: 12rpx;
}

.notes-popup-item-date {
  font-size: 22rpx;
  color: #a6a6a6;
}

.notes-popup-item-text {
  font-size: 24rpx;
  color: #5e5e5e;
  line-height: 1.6;
}

.text-primary {
  color: #0052d9 !important;
}

.text-success {
  color: #00a870 !important;
}

.text-warning {
  color: #ed7b2f !important;
}

.text-purple {
  color: #7c3aed !important;
}

.safe-area-bottom {
  padding-bottom: env(safe-area-inset-bottom);
}.card-title-row { margin-bottom: 24rpx; }
.card-title-row .section-title { margin-bottom: 0; }

.top-customer-list { display: flex; flex-direction: column; gap: 16rpx; }
.top-customer-item { display: flex; align-items: center; gap: 24rpx; padding: 16rpx 0; border-bottom: 2rpx solid #f3f3f3; }
.top-customer-item:last-child { border-bottom: none; }
.top-customer-item--hover { background: #f9f9f9; border-radius: 16rpx; }
.top-customer-avatar { width: 76rpx; height: 76rpx; border-radius: 20rpx; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.top-customer-avatar-text { font-size: 30rpx; font-weight: 500; color: #ffffff; }
.avatar-gradient-pink { background: linear-gradient(135deg, #f472b6, #e11d48); }
.avatar-gradient-amber { background: linear-gradient(135deg, #fbbf24, #f97316); }
.avatar-gradient-green { background: linear-gradient(135deg, #4ade80, #059669); }
.avatar-gradient-blue { background: linear-gradient(135deg, #60a5fa, #4f46e5); }
/* 头像渐变色由 app.wxss 全局 .avatar-{key} 统一提供（VI §8） */
.avatar-gradient-teal { background: linear-gradient(135deg, #2dd4bf, #10b981); }
.top-customer-info { flex: 1; min-width: 0; }
.top-customer-name-row { display: flex; align-items: center; gap: 8rpx; margin-bottom: 8rpx; }
.top-customer-name { font-size: 28rpx; font-weight: 600; color: #242424; }
.top-customer-heart { font-size: 24rpx; }
.top-customer-score { font-size: 24rpx; font-weight: 700; font-variant-numeric: tabular-nums; }
.top-customer-score-success { color: #00a870; }
.top-customer-score-warning { color: #ed7b2f; }
.top-customer-score-gray { color: #8b8b8b; }
.top-customer-stats { display: flex; align-items: center; gap: 24rpx; }
.top-customer-stat { font-size: 22rpx; color: #a6a6a6; }
.top-customer-stat-val { font-weight: 600; color: #393939; }
.toggle-btn { display: flex; align-items: center; justify-content: center; padding: 16rpx 0; font-size: 26rpx; color: var(--color-primary); font-weight: 500; margin-top: 8rpx; }
.toggle-btn--hover { opacity: 0.6; }
.task-item--hover { opacity: 0.75; }

/* perf-progress-box */
.perf-progress-box {
  padding: 24rpx 24rpx 50rpx 24rpx;
  border: 1rpx solid rgba(0, 0, 0, 0.2);
  border-radius: 16rpx;
  background: rgba(0, 139, 199, 0.02);
}

/* 近期服务明细 */