.slider-captcha {
  width: 320px;
  user-select: none;
}

/* ─── Image area ─── */

.slider-captcha__image {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  background: #f0f0f0;
  margin-bottom: 12px;
}

.slider-captcha__bg {
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.slider-captcha__piece {
  position: absolute;
  pointer-events: none;
}

.slider-captcha__loading {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.7);
  color: #666;
  font-size: 14px;
}

.slider-captcha__refresh {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  font-size: 14px;
  cursor: pointer;
  transition: background 0.2s;
}

.slider-captcha__refresh:hover:not(:disabled) {
  background: rgba(0, 0, 0, 0.55);
}

.slider-captcha__refresh:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* ─── Slider track ─── */

.slider-captcha__track {
  position: relative;
  height: 40px;
  border-radius: 20px;
  background: #f5f5f5;
  border: 1px solid #e8e8e8;
  overflow: hidden;
}

.slider-captcha__track-fill {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 20px 0 0 20px;
  opacity: 0.2;
  transition: background 0.2s;
}

.slider-captcha__track-text {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 13px;
  color: #999;
  pointer-events: none;
  white-space: nowrap;
}

/* ─── Handle ─── */

.slider-captcha__handle {
  position: absolute;
  top: -1px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 2px solid #e8e8e8;
  background: #fff;
  cursor: grab;
  display: grid;
  place-items: center;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
  transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
  z-index: 1;
  touch-action: none;
}

.slider-captcha__handle:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.slider-captcha__handle:active {
  cursor: grabbing;
}

.slider-captcha__handle--success {
  animation: slider-shake-none 0s;
}

.slider-captcha__handle--fail {
  animation: slider-shake 0.4s ease-in-out;
}

.slider-captcha__handle-icon {
  font-size: 16px;
  font-weight: bold;
  color: #999;
  line-height: 1;
}

.slider-captcha__handle--success .slider-captcha__handle-icon {
  color: #fff;
}

.slider-captcha__handle--fail .slider-captcha__handle-icon {
  color: #fff;
}

/* ─── Shake animation ─── */

@keyframes slider-shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-8px); }
  40% { transform: translateX(8px); }
  60% { transform: translateX(-6px); }
  80% { transform: translateX(6px); }
}
.training-process-steps .ant-steps-item-container {
  cursor: pointer;
}

.training-process-steps .ant-steps-item-title {
  transition: color 0.2s;
}

.training-process-steps .ant-steps-item:not(.ant-steps-item-active):hover .ant-steps-item-title {
  color: #1677ff;
}
/* 对齐 yun_shang classMembers.vue / 班级人员截图 */
.training-class-people-page {
  padding: 20px;
}

.training-class-people-page .search-filter-bar {
  margin-bottom: 0;
}

.training-class-people-page .filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.training-class-people-page .filter-actions .filter-select {
  min-width: 200px;
}

.training-class-people-page .class-people-table {
  margin-top: 4px;
}

.training-class-people-page .ant-table-thead > tr > th {
  background: #f8f9fa !important;
  color: #909399;
  font-weight: 500;
}

.training-class-people-page .class-people-pagination {
  margin-top: 16px;
  display: flex;
  justify-content: flex-end;
}

.training-class-people-page .class-row-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  line-height: 1.5;
}

.training-class-people-page .class-row-actions-line {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 12px;
}

.training-class-people-page .class-action-link {
  padding: 0;
  border: none;
  background: transparent;
  color: #409eff;
  font-size: 14px;
  line-height: 1.5;
  cursor: pointer;
}

.training-class-people-page .class-action-link:hover {
  color: #66b1ff;
}

.training-class-people-page .class-action-link-danger {
  color: #ff7875;
}

.training-class-people-page .class-action-link-danger:hover {
  color: #ff9c99;
}

.training-class-people-page .link-action {
  color: #409eff;
  padding: 0;
}

.training-class-people-page .link-action-danger {
  color: #ff7875;
  padding: 0;
}

/* 学员列表证件照 — 对齐 yun_shang classMembers.vue 120×168 */
.training-class-people-page .student-id-photo {
  width: 120px;
  height: 168px;
  object-fit: cover;
  display: block;
  margin: 0 auto;
}

.training-class-people-page .mar-b10 {
  margin-bottom: 10px;
}

.training-class-people-page .mar-r20 {
  margin-right: 20px;
}

/* 学员列表弹窗 — 对齐截图 */
.class-student-list-modal .ant-modal-header {
  margin-bottom: 0;
}

.class-student-list-modal .student-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.class-student-list-modal .student-toolbar-btn {
  height: 32px;
  padding: 0 15px;
  font-size: 14px;
  color: #606266;
  background: #fff;
  border: 1px solid #dcdfe6;
  border-radius: 4px;
  box-shadow: none;
}

.class-student-list-modal .student-toolbar-btn:hover {
  color: #409eff;
  border-color: #c6e2ff;
  background: #ecf5ff;
}

.class-student-list-modal .class-student-table-scroll {
  width: 100%;
}

.class-student-list-modal .class-student-table .ant-table-content > table {
  min-width: 1060px;
}

.class-student-list-modal .class-student-table .ant-table {
  font-size: 14px;
  color: #606266;
}

.class-student-list-modal .class-student-table .ant-table-thead > tr > th {
  background: #f8f9fa !important;
  color: #909399;
  font-weight: 500;
  padding: 12px 8px;
  border-bottom: 1px solid #ebeef5 !important;
  border-inline-end: 1px solid #ebeef5 !important;
}

.class-student-list-modal .class-student-table .ant-table-tbody > tr > td {
  padding: 12px 8px;
  border-bottom: 1px solid #ebeef5 !important;
  border-inline-end: 1px solid #ebeef5 !important;
  vertical-align: middle;
}

.class-student-list-modal .class-student-table .ant-table-tbody > tr:hover > td {
  background: #f5f7fa !important;
}

.class-student-list-modal .class-student-table .ant-table-selection-column {
  padding-inline: 12px !important;
}

.class-student-list-modal .student-photo-cell {
  width: 72px;
  min-height: 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  padding: 4px 0;
}

.class-student-list-modal .student-id-photo {
  width: 72px;
  height: 96px;
  object-fit: cover;
  display: block;
  border-radius: 2px;
}

.class-student-list-modal .student-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.class-student-list-modal .student-action-link {
  padding: 0;
  border: none;
  background: transparent;
  color: #409eff;
  font-size: 14px;
  line-height: 1.5;
  cursor: pointer;
}

.class-student-list-modal .student-action-link:hover {
  color: #66b1ff;
}

.class-student-list-modal .student-action-link-danger {
  color: #ff7875;
}

.class-student-list-modal .student-action-link-danger:hover {
  color: #ff9c99;
}

.class-student-list-modal .mar-b10 {
  margin-bottom: 10px;
}

.class-student-list-modal .student-pagination {
  margin-top: 16px;
  display: flex;
  justify-content: flex-end;
}

.class-student-list-modal .student-pagination .ant-pagination-total-text {
  color: #606266;
  font-size: 14px;
}

/* 教务人员 / 负责人弹窗 — 对齐截图 */
.class-staff-modal .ant-modal-header {
  margin-bottom: 0;
}

.class-staff-modal .staff-toolbar {
  margin-bottom: 12px;
}

.class-staff-modal .staff-toolbar-btn {
  height: 32px;
  padding: 0 15px;
  font-size: 14px;
  color: #606266;
  background: #fff;
  border: 1px solid #dcdfe6;
  border-radius: 4px;
  box-shadow: none;
}

.class-staff-modal .staff-toolbar-btn:hover {
  color: #409eff;
  border-color: #c6e2ff;
  background: #ecf5ff;
}

.class-staff-modal .class-staff-table .ant-table {
  font-size: 14px;
  color: #606266;
}

.class-staff-modal .class-staff-table .ant-table-thead > tr > th {
  background: #f8f9fa !important;
  color: #909399;
  font-weight: 500;
  padding: 12px 8px;
  border-bottom: 1px solid #ebeef5 !important;
}

.class-staff-modal .class-staff-table .ant-table-tbody > tr > td {
  padding: 12px 8px;
  border-bottom: 1px solid #ebeef5 !important;
  vertical-align: middle;
}

.class-staff-modal .class-staff-table .ant-table-tbody > tr:hover > td {
  background: #f5f7fa !important;
}

.class-staff-modal .class-staff-table .ant-empty-description {
  color: #909399;
}

.class-staff-modal .staff-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.class-staff-modal .staff-action-link {
  padding: 0;
  border: none;
  background: transparent;
  color: #409eff;
  font-size: 14px;
  line-height: 1.5;
  cursor: pointer;
}

.class-staff-modal .staff-action-link:hover {
  color: #66b1ff;
}

.class-staff-modal .staff-action-link-danger {
  color: #ff7875;
}

.class-staff-modal .staff-action-link-danger:hover {
  color: #ff9c99;
}

.class-staff-modal .staff-import-actions {
  margin-bottom: 12px;
}

.training-class-people-page .idcard-import-textarea {
  max-width: 480px;
  margin-right: 20px;
}

.training-class-people-page .idcard-import-actions {
  margin-top: 20px;
}

.training-class-people-page .kcbiao-upload-row {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
}

.training-class-people-page .file-preview-container iframe {
  border: none;
}

.training-class-people-page .bg-ff {
  background-color: #fff;
}
/* 对齐 yun_shang classApplication.vue */
.training-class-declare-page {
  padding: 20px;
}

.training-class-declare-page .filter-bar {
  margin-top: 30px;
}

.training-class-declare-page .table-wrap {
  margin-top: 10px;
}

.training-class-declare-page .pagination-bar {
  margin-top: 20px;
  text-align: right;
  display: flex;
  justify-content: flex-end;
}

.training-class-declare-page .ant-table-thead > tr > th {
  background: #f8f9fa !important;
}

.training-class-declare-page .mar-b10 {
  margin-bottom: 10px;
}

.training-class-declare-page .mar-r10 {
  margin-right: 10px;
}

.training-class-declare-page .link-action {
  color: #409eff;
  padding: 0;
}

.training-class-declare-page .upload-demos {
  width: 100%;
}

.training-class-declare-page .upload-demos .ant-upload-drag {
  height: 160px;
  padding: 0;
}

.training-class-declare-page .file-preview-container {
  min-height: 400px;
}

.training-class-declare-page .file-preview-container iframe {
  width: 100%;
  height: 600px;
  border: none;
}
/* 对齐 yun_shang requirementsManagement.vue */
.requirements-management-page {
  padding: 20px;
}

.requirements-management-page .search-filter-bar {
  margin-bottom: 0;
}

.requirements-management-page .filter-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.requirements-management-page .filter-actions .filter-select {
  min-width: 200px;
}

.requirements-management-page .filter-actions .tab-btn-spacer {
  margin-left: 4px;
}

/* table */
.requirements-management-page .requirements-table {
  margin-top: 4px;
}

.requirements-management-page .ant-table-thead > tr > th {
  background: #f8f9fa !important;
}

/* pagination */
.requirements-management-page .requirements-pagination {
  margin-top: 16px;
  display: flex;
  justify-content: flex-end;
}

/* modal form */
.requirements-management-page .convert-form {
  padding-top: 8px;
}
.enterprise-demand-page {
  padding: 16px;
  background: #fff;
  min-height: 100%;
}

.enterprise-demand-toolbar {
  margin-bottom: 12px;
}

.enterprise-demand-pagination {
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
}

.program-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-bottom: 12px;
}

.program-body .mar-t10 {
  margin-top: 10px;
}

.enterprise-demand-page .solution-doc-preview {
  margin-top: 12px;
  min-height: 420px;
  border: 1px solid #f0f0f0;
  border-radius: 4px;
  padding: 8px;
  background: #fafafa;
}

.enterprise-demand-page .solution-doc-preview__iframe {
  width: 100%;
  height: 65vh;
  min-height: 420px;
  border: 0;
  background: #fff;
}

.enterprise-demand-page .solution-doc-preview__docx {
  background: #fff;
}

.enterprise-demand-page .solution-doc-preview .docx-wrapper {
  background: #fff;
  padding: 12px;
}
.enterprise-talent-demand-page {
  padding: 16px;
  background: #fff;
  min-height: 100%;
}

.enterprise-talent-demand-toolbar {
  margin-bottom: 12px;
}

.enterprise-talent-demand-pagination {
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
}
/* 对齐 yun_shang trainingProgram.vue */
.training-program-page {
  padding: 20px;
}

.training-program-page .ant-table-thead > tr > th {
  background: #f8f9fa !important;
}

.training-program-page .pagination-bar {
  margin-top: 20px;
  text-align: right;
  display: flex;
  justify-content: flex-end;
}

.training-program-page .mar-t10 {
  margin-top: 10px;
}

.training-program-page .mar-l5 {
  margin-left: 5px;
}

.training-program-page .mar-l20 {
  margin-left: 20px;
}

.training-program-page .icon-add {
  display: inline-flex;
  align-items: center;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  font-size: 12px;
  padding: 2px 8px;
  cursor: pointer;
  user-select: none;
}

.training-program-page .icon-add:hover {
  border-color: #409eff;
  color: #409eff;
}

.training-program-page .upload-demos {
  width: 100%;
}

.training-program-page .upload-demos .ant-upload-drag {
  height: 160px;
  padding: 0;
}

.training-program-page .upload-tip-path {
  margin-left: 20px;
  color: rgba(0, 0, 0, 0.45);
  word-break: break-all;
}

.training-program-page .office-box {
  height: 300px;
  overflow-y: auto;
  border: 1px solid #e0e0e0;
}

.training-program-page .solution-doc-preview {
  margin-top: 10px;
  min-height: 300px;
  max-height: 70vh;
  overflow: auto;
  border: 1px solid #e0e0e0;
  background: #525659;
  padding: 12px;
}

.training-program-page .solution-doc-preview__iframe {
  width: 100%;
  min-height: 300px;
  height: 70vh;
  border: none;
  background: #fff;
}

.training-program-page .solution-doc-preview__docx {
  background: #525659;
}

.training-program-page .solution-doc-preview .docx-wrapper {
  margin: 0 auto;
  background: #fff;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
}

.training-program-page .office-box iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.training-program-page .link-view {
  color: #409eff;
  padding: 0;
}

.training-program-page .link-edit {
  color: #409eff;
  padding: 0;
}

.training-program-page .link-delete {
  color: #ff7875;
  padding: 0;
}

.training-program-page .budget-table {
  margin-top: 10px;
}
/* 报名人员编辑弹窗 — 对齐 information.vue L199-461 */
.people-edit-modal .ant-modal-body {
  padding-top: 12px;
}

.people-edit-modal-body {
  max-height: 600px;
  overflow-y: auto;
}

.people-edit-section-title {
  height: 30px;
  line-height: 30px;
  background-color: #626262;
  color: #fff;
  padding-left: 10px;
  margin-bottom: 10px;
}

.people-edit-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.people-edit-fields {
  flex: 1;
  min-width: 320px;
}

.people-edit-images {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-start;
}

.people-edit-image-block {
  padding: 0 12px;
}

.people-edit-image-label {
  margin-bottom: 8px;
}

.people-edit-image-box {
  border: 1px solid #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #fafafa;
}

.people-edit-image-box.id-card {
  width: 243px;
  height: 153px;
}

.people-edit-image-box.photo {
  width: 120px;
  height: 168px;
}

.people-edit-image-box.contract {
  width: 243px;
  height: 353px;
}

.people-edit-image-box .ant-image,
.people-edit-image-box img {
  max-width: 100%;
  max-height: 100%;
  object-fit: fill;
}

.people-edit-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

.people-edit-modal .people-input,
.people-edit-modal .ant-select.people-input {
  width: 400px;
  max-width: 100%;
}

.people-edit-modal .ant-form-item-label {
  width: 160px;
  flex: 0 0 160px;
}

.people-edit-work-exp-item {
  margin-bottom: 8px;
  padding: 8px 12px;
  background: #fafafa;
  border-radius: 4px;
  line-height: 1.6;
}

.people-edit-contract-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.people-edit-cert-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.people-edit-footer {
  text-align: right;
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px solid #f0f0f0;
}
/* 对齐 yun_shang company/information.vue */
.training-list-container {
  padding: 20px;
}

.training-list-container .top-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}

.training-list-container .pagination-container {
  margin-top: 20px;
  text-align: right;
  display: flex;
  justify-content: flex-end;
}

.training-list-container .ant-table-thead > tr > th {
  background: #f8f9fa !important;
}

.training-list-container .text-C {
  text-align: center;
}

.training-list-container .tools {
  margin-bottom: 16px;
}

.training-list-container .status-tag {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 500;
}

.training-list-container .status-tag.approved,
.training-list-container .status-tag.passed,
.training-list-container .status-tag.status-1 {
  background-color: #f0f7ea;
  color: #52c41a;
}

.training-list-container .status-tag.pending,
.training-list-container .status-tag.status-0 {
  background-color: #fffbe6;
  color: #faad14;
}

.training-list-container .status-tag.rejected,
.training-list-container .status-tag.failed,
.training-list-container .status-tag.status-2 {
  background-color: #fff2f0;
  color: #f5222d;
}

.training-list-container .operate-btn {
  padding: 0 6px;
  color: #1890ff;
}

.training-list-container .operate-btn-danger {
  color: #f5222d !important;
}

.training-list-container .cover-table-cell {
  width: 60px;
  height: 40px;
  line-height: 0;
}

.training-list-container .cover-table-thumb {
  width: 60px;
  height: 40px;
  display: block;
  object-fit: cover;
  border-radius: 2px;
}

.training-list-container .cover-uploader .cover {
  width: 178px;
  height: 178px;
  display: block;
  object-fit: cover;
}

.training-list-container .cover-uploader {
  border: 1px dashed #ccc;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.training-list-container .cover-uploader:hover {
  border-color: #409eff;
}

.training-list-container .cover-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.training-list-container .people-input {
  width: 400px;
}

.training-list-container .people-search-row {
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 0;
}

/* Modal 通过 portal 挂到 body，样式不能依赖 .training-list-container */
.people-modal-body .people-search-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 12px;
  margin-bottom: 10px;
}

.people-modal-body .people-search-row .people-search-input,
.people-modal-body .people-search-row .people-search-input.ant-input-affix-wrapper {
  width: 200px;
  flex: 0 0 200px;
}

.people-modal-body .people-search-row .people-search-status,
.people-modal-body .people-search-row .people-search-status.ant-select {
  width: 160px;
  flex: 0 0 160px;
}

.people-modal-body .tools {
  margin-bottom: 16px;
}

.training-list-container .people-search-row .ant-input-affix-wrapper,
.training-list-container .people-search-row .ant-input {
  width: 200px;
  margin-right: 20px;
}

.training-list-container .people-search-row .ant-select {
  width: 200px;
  flex: 0 0 auto;
}

.training-list-container .sign-up-form .ant-form-item-label {
  width: 120px;
  flex: 0 0 120px;
}

.training-list-container .sign-up-form .ant-select,
.training-list-container .sign-up-form .ant-input {
  max-width: 400px;
}

.training-list-container .qrcode-row {
  display: flex;
  justify-content: space-between;
}

/* 报名计划编辑弹窗（portal 渲染，不依赖 .training-list-container） */
.sign-up-form .cover-uploader .cover {
  width: 178px;
  height: 178px;
  display: block;
  object-fit: cover;
}

.sign-up-form .cover-uploader {
  border: 1px dashed #ccc;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.sign-up-form .cover-uploader:hover {
  border-color: #409eff;
}

.sign-up-form .cover-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 二维码弹窗（portal 渲染，不依赖 .training-list-container） */
.qrcode-modal-body .qrcode-row {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
  gap: 32px;
}

.qrcode-modal-body .qrcode-col {
  text-align: center;
  flex: 0 0 auto;
}

.qrcode-modal-body .qrcode-title {
  margin-bottom: 16px;
  text-align: center;
}

.qrcode-modal-body .text-C {
  text-align: center;
  margin-top: 8px;
}

.qrcode-modal-body .wx-qrcode-placeholder {
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}

.training-list-container .qrcode-col {
  text-align: center;
}

.training-list-container .wx-qrcode-placeholder {
  width: 120px;
  height: 120px;
  line-height: 120px;
  text-align: center;
  margin: 0 auto;
}

.training-list-container .people-modal-body {
  background-color: #fff;
}

.training-list-container .tools .ant-btn {
  margin-right: 0;
}

.training-list-container .people-status-text {
  color: rgba(0, 0, 0, 0.88);
}
.data-panel-page {
  padding: 24px 20px 48px;
  max-width: 1600px;
  margin: 0 auto;
}

/* KPI grid responsive */
.dp-kpi-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
  margin-bottom: 28px;
}
@media (max-width: 1400px) { .dp-kpi-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .dp-kpi-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .dp-kpi-grid { grid-template-columns: 1fr; } }

/* KPI card hover */
.dp-kpi-card {
  background: #fff;
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  transition: transform 0.2s, box-shadow 0.2s;
  border: 1px solid transparent;
}
.dp-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(42, 109, 255, 0.12);
}

/* ===== Sticky Navigation Bar ===== */
.dp-nav-bar {
  position: sticky;
  top: 0;
  z-index: 99;
  display: flex;
  gap: 4px;
  padding: 12px 16px;
  margin-bottom: 28px;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.08);
  border: 1px solid #e2e8f0;
}

.dp-nav-btn {
  flex: 1;
  min-width: 80px;
  padding: 12px 20px;
  border: none;
  border-radius: 12px;
  background: transparent;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  color: #64748b;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
}

.dp-nav-btn:hover {
  background: #f0f6ff;
  color: #2A6DFF;
}

.dp-nav-btn.active {
  background: #2A6DFF;
  color: #fff;
  font-weight: 600;
  box-shadow: 0 4px 16px rgba(42, 109, 255, 0.35);
}

@media (max-width: 768px) {
  .dp-nav-bar {
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px 10px;
    border-radius: 12px;
  }
  .dp-nav-btn {
    flex: 1 1 calc(50% - 6px);
    min-width: 0;
    padding: 10px 12px;
    font-size: 13px;
  }
}

/* Section */
.dp-section {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 24px 28px;
  margin-bottom: 28px;
  border: 1px solid #e2e8f0;
}

/* Grid responsive */
.dp-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.dp-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.dp-grid-23 { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; }
.dp-grid-32 { display: grid; grid-template-columns: 1fr 1.2fr; gap: 20px; }
@media (max-width: 1100px) {
  .dp-grid-2, .dp-grid-3, .dp-grid-23, .dp-grid-32 { grid-template-columns: 1fr; }
}

/* Resource grid responsive */
.dp-resource-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}
@media (max-width: 1200px) { .dp-resource-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .dp-resource-grid { grid-template-columns: 1fr; } }

/* Resource card hover */
.dp-res-card {
  background: #f5f7fa;
  border-radius: 14px;
  padding: 20px;
  transition: transform 0.2s;
}
.dp-res-card:hover {
  transform: translateY(-2px);
}

/* Sub card */
.dp-sub-card {
  background: #f5f7fa;
  border-radius: 14px;
  padding: 18px;
  height: 100%;
}

/* Project card hover */
.dp-project-card {
  background: #f5f7fa;
  border-radius: 14px;
  padding: 20px;
  margin-bottom: 16px;
  border: 1px solid #e2e8f0;
  transition: box-shadow 0.2s;
}
.dp-project-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}
/* Tab 按钮 */
.tp-tab-btn {
  padding: 12px 28px;
  border: none;
  background: #fff;
  border-radius: 12px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  color: #64748b;
  cursor: pointer;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  transition: all 0.2s;
}

.tp-tab-btn:hover {
  color: #2A6DFF;
}

.tp-tab-btn.active {
  background: #2A6DFF;
  color: #fff;
  box-shadow: 0 4px 16px rgba(42, 109, 255, 0.35);
}

/* 入口卡片 hover 效果 */
.tp-entry-card:hover {
  border-color: #2A6DFF !important;
  box-shadow: 0 12px 40px rgba(42, 109, 255, 0.12);
  transform: translateY(-2px);
}

/* 响应式 */
@media (max-width: 768px) {
  .tp-tab-btn {
    flex: 1;
    padding: 10px 16px;
    font-size: 13px;
    text-align: center;
  }
}
/* ============================================================
   任务档案页 - 复刻原型：任务档案.html
   ============================================================ */

.task-archives-page {
  --ta-primary: #2A6DFF;
  --ta-primary-hover: #1E5AE8;
  --ta-primary-light: #E8F0FF;
  --ta-bg: #F5F7FC;
  --ta-card: #FFFFFF;
  --ta-text: #1A2332;
  --ta-text-secondary: #64748B;
  --ta-border: #E2E8F0;
  --ta-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  --ta-radius-card: 20px;
  --ta-radius-btn: 12px;
  --ta-danger: #EF4444;
  min-height: 100vh;
  background: var(--ta-bg);
  color: var(--ta-text);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.ta-topbar {
  background: var(--ta-card);
  box-shadow: var(--ta-shadow);
  padding: 16px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 50;
}

.ta-topbar-left {
  display: flex;
  align-items: center;
  gap: 16px;
}

.ta-back-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ta-text-secondary);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  padding: 8px 14px;
  border-radius: var(--ta-radius-btn);
  cursor: pointer;
  transition: all 0.2s;
}

.ta-back-link:hover {
  background: var(--ta-primary-light);
  color: var(--ta-primary);
}

.ta-title {
  font-size: 20px;
  font-weight: 700;
  margin: 0;
}

.ta-sub {
  font-size: 13px;
  color: var(--ta-text-secondary);
  font-weight: 400;
}

.ta-topbar-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.ta-page {
  max-width: 1280px;
  margin: 0 auto;
  padding: 28px 24px 64px;
}

.ta-stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.ta-stat-card {
  background: var(--ta-card);
  border-radius: var(--ta-radius-card);
  padding: 20px 22px;
  box-shadow: var(--ta-shadow);
  cursor: pointer;
  border: 2px solid transparent;
  transition: all 0.2s;
}

.ta-stat-card:hover,
.ta-stat-card.active {
  border-color: var(--ta-primary);
  background: var(--ta-primary-light);
}

.ta-stat-val {
  font-size: 26px;
  font-weight: 700;
  color: var(--ta-primary);
}

.ta-stat-lbl {
  font-size: 13px;
  color: var(--ta-text-secondary);
  margin-top: 4px;
}

.ta-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-bottom: 20px;
}

.ta-search-box {
  flex: 1;
  min-width: 200px;
  position: relative;
}

.ta-search-box .anticon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ta-text-secondary);
}

.ta-search-box input,
.ta-filter-select {
  border: 1px solid var(--ta-border);
  border-radius: var(--ta-radius-btn);
  font-family: inherit;
  font-size: 14px;
  outline: none;
  background: var(--ta-card);
}

.ta-search-box input {
  width: 100%;
  padding: 11px 16px 11px 40px;
}

.ta-filter-select {
  min-width: 120px;
  padding: 11px 14px;
}

.ta-btn {
  padding: 11px 22px;
  border: none;
  border-radius: var(--ta-radius-btn);
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: all 0.2s;
  text-decoration: none;
  white-space: nowrap;
}

.ta-btn-primary {
  background: var(--ta-primary);
  color: #fff;
}

.ta-btn-primary:hover {
  background: var(--ta-primary-hover);
}

.ta-btn-secondary {
  background: var(--ta-card);
  color: var(--ta-text);
  border: 1px solid var(--ta-border);
}

.ta-btn-secondary:hover {
  background: var(--ta-bg);
}

.ta-card {
  background: var(--ta-card);
  border-radius: var(--ta-radius-card);
  box-shadow: var(--ta-shadow);
  overflow: hidden;
}

.ta-table-wrap {
  overflow-x: auto;
}

.ta-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

.ta-table th {
  text-align: left;
  padding: 14px 16px;
  font-weight: 600;
  color: var(--ta-text-secondary);
  font-size: 12px;
  background: #FAFBFD;
  border-bottom: 2px solid var(--ta-border);
  white-space: nowrap;
}

.ta-table td {
  padding: 16px;
  border-bottom: 1px solid var(--ta-border);
  vertical-align: middle;
}

.ta-table tr:hover td {
  background: rgba(42, 109, 255, 0.02);
}

.ta-table tr.clickable {
  cursor: pointer;
}

.task-name {
  font-weight: 500;
  color: var(--ta-text);
}

.task-code {
  font-size: 11px;
  color: var(--ta-text-secondary);
  margin-top: 2px;
}

.priority-badge,
.status-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}

.priority-high { background: #FEE2E2; color: #DC2626; }
.priority-medium { background: #FEF3C7; color: #D97706; }
.priority-low { background: #D1FAE5; color: #059669; }
.status-active { background: #D1FAE5; color: #059669; }
.status-draft { background: #F1F5F9; color: #64748B; }
.status-pending { background: #FEF3C7; color: #D97706; }
.status-done { background: #DBEAFE; color: #2563EB; }

.overdue-text {
  color: var(--ta-danger);
  font-weight: 500;
}

.overdue-text .anticon {
  margin-left: 6px;
  color: var(--ta-danger);
}

.progress-wrap {
  min-width: 80px;
}

.progress-text {
  font-size: 11px;
  color: var(--ta-text-secondary);
}

.progress-bar {
  height: 6px;
  background: var(--ta-bg);
  border-radius: 3px;
  overflow: hidden;
  margin-top: 4px;
}

.progress-fill {
  height: 100%;
  background: var(--ta-primary);
  border-radius: 3px;
}

.action-btns {
  display: flex;
  gap: 6px;
  flex-wrap: nowrap;
  white-space: nowrap;
}

.action-btn {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border: none;
  border-radius: 8px;
  background: var(--ta-bg);
  color: var(--ta-text-secondary);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all 0.2s;
}

.action-btn:hover {
  background: var(--ta-primary-light);
  color: var(--ta-primary);
}

.action-btn.delete:hover {
  background: #FEE2E2;
  color: var(--ta-danger);
}

.ta-empty {
  text-align: center;
  padding: 60px 24px;
  color: var(--ta-text-secondary);
}

.ta-empty .anticon {
  font-size: 48px;
  color: var(--ta-border);
  margin-bottom: 16px;
}

.ta-empty p {
  margin: 0 0 16px;
}

.ta-drawer-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 200;
}

.ta-drawer-overlay.show {
  display: block;
}

.ta-drawer {
  position: fixed;
  top: 0;
  right: -480px;
  width: 100%;
  max-width: 460px;
  height: 100vh;
  background: var(--ta-card);
  box-shadow: -8px 0 40px rgba(0, 0, 0, 0.12);
  z-index: 201;
  transition: right 0.3s ease;
  overflow-y: auto;
}

.ta-drawer-overlay.show .ta-drawer {
  right: 0;
}

.ta-drawer-head {
  padding: 24px;
  border-bottom: 1px solid var(--ta-border);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.ta-drawer-head h2 {
  font-size: 18px;
  margin: 0 0 6px;
  padding-right: 16px;
}

.ta-drawer-close {
  border: none;
  background: var(--ta-bg);
  width: 36px;
  height: 36px;
  border-radius: 10px;
  cursor: pointer;
  color: var(--ta-text-secondary);
}

.ta-drawer-body {
  padding: 24px;
}

.ta-detail-section {
  margin-bottom: 24px;
}

.ta-detail-section h4 {
  font-size: 13px;
  color: var(--ta-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0 0 12px;
}

.ta-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  font-size: 14px;
}

.ta-detail-item label {
  display: block;
  font-size: 12px;
  color: var(--ta-text-secondary);
  margin-bottom: 4px;
}

.ta-detail-item span {
  font-weight: 500;
}

.ta-detail-description {
  margin: 12px 0 0;
  font-size: 13px;
  color: var(--ta-text-secondary);
}

.ta-config-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ta-config-tag {
  font-size: 12px;
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--ta-bg);
}

.ta-config-tag.done {
  background: #D1FAE5;
  color: #059669;
}

.ta-drawer-actions {
  padding: 16px 24px 24px;
  display: flex;
  gap: 10px;
  border-top: 1px solid var(--ta-border);
}

@media (max-width: 768px) {
  .ta-topbar {
    padding: 14px 18px;
    align-items: flex-start;
    gap: 12px;
    flex-direction: column;
  }

  .ta-page {
    padding: 20px 16px 48px;
  }

  .ta-detail-grid {
    grid-template-columns: 1fr;
  }

  .ta-drawer {
    max-width: 100%;
  }
}
/* ============================================================
   培训流程页 - TrainingProcessPage.css
   ============================================================ */

.tp-page { max-width: 1280px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- header ---- */
.tp-header { margin-bottom: 28px; }
.tp-header h2 { font-size: 26px; font-weight: 700; margin-bottom: 6px; }
.tp-header p { color: #64748B; font-size: 14px; }

/* ---- steps nav ---- */
.tp-steps-nav {
  display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 28px;
  background: #fff; padding: 16px 20px; border-radius: 20px;
  box-shadow: 0 4px 24px rgba(42,109,255,.06);
}
.tp-step-item {
  flex: 1; min-width: 80px; text-align: center; padding: 12px 8px;
  font-size: 13px; font-weight: 500; color: #64748B; cursor: pointer;
  border-radius: 12px; transition: all 0.2s;
}
.tp-step-item:hover { background: #E8F0FF; color: #2A6DFF; }
.tp-step-item.active {
  background: #2A6DFF; color: #fff; box-shadow: 0 4px 12px rgba(42,109,255,.3);
}
.tp-step-num { display: block; font-size: 11px; opacity: 0.8; margin-bottom: 2px; }

/* ---- card ---- */
.tp-card {
  background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06);
  padding: 24px 28px;
}

/* ---- entry card ---- */
.tp-entry-card {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 28px 32px;
  background: linear-gradient(135deg, #E8F0FF 0%, #fff 60%);
  border: 2px dashed rgba(42,109,255,.25);
  border-radius: 20px; text-decoration: none; color: inherit;
  transition: all 0.25s ease; cursor: pointer; margin-bottom: 24px;
}
.tp-entry-card:hover { border-color: #2A6DFF; box-shadow: 0 8px 32px rgba(42,109,255,.12); transform: translateY(-2px); }
.tp-entry-text h3 { font-size: 18px; font-weight: 700; color: #2A6DFF; margin-bottom: 6px; }
.tp-entry-text p { font-size: 13px; color: #64748B; max-width: 520px; }
.tp-entry-btn {
  flex-shrink: 0; padding: 14px 28px; background: #2A6DFF; color: #fff;
  border-radius: 12px; font-weight: 600; font-size: 14px;
  display: inline-flex; align-items: center; gap: 10px;
}

/* ---- desc ---- */
.tp-desc { font-size: 13px; color: #64748B; margin-bottom: 16px; }

/* ---- stat mini ---- */
.tp-stat-mini-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; }
.tp-stat-mini { background: #F5F7FC; border-radius: 14px; padding: 18px; text-align: center; }
.tp-stat-val { font-size: 26px; font-weight: 700; color: #2A6DFF; }
.tp-stat-lbl { font-size: 13px; color: #64748B; margin-top: 4px; }

/* ---- responsive ---- */
@media (max-width: 768px) {
  .tp-steps-nav { flex-direction: column; }
  .tp-step-item { min-width: 100%; }
}
/* ============================================================
   ProjectArchivesPage —— 对照原型 styles 原封不动照搬
   ============================================================ */

.pa-page { max-width: 1280px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- page-header（原型 .page-header lines 181-194） ---- */
.pa-page .page-header { margin-bottom: 28px; }
.pa-page .page-header h2 {
  font-size: 24px; font-weight: 700; color: #1A2332; margin-bottom: 8px;
}
.pa-page .page-header p {
  font-size: 14px; color: #64748B;
}

/* ---- archive-section-title（原型 .archive-section-title lines 828-837） ---- */
.archive-section-title {
  font-size: 15px; font-weight: 600; color: #1A2332;
  margin-bottom: 14px; display: flex; align-items: center; gap: 8px;
}
.archive-section-title .anticon { color: #2A6DFF; }

/* ---- archive-entry-list（原型 .archive-entry-list lines 947-948） ---- */
.archive-entry-list { display: flex; flex-direction: column; gap: 0; }
.archive-entry-list .pa-entry-card { margin-bottom: 16px; }

/* ---- archive-entry-list-compact（原型 .archive-entry-list-compact lines 949-954） ---- */
.archive-entry-list-compact {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}
.archive-entry-list-compact .pa-entry-card { margin-bottom: 0; }

/* ---- pa-entry-card（原型 .create-task-entry lines 631-672） ---- */
.pa-entry-card {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 28px 32px;
  background: linear-gradient(135deg, #E8F0FF 0%, #fff 60%);
  border: 2px dashed rgba(42, 109, 255, 0.25);
  border-radius: 20px; text-decoration: none; color: inherit;
  cursor: pointer; transition: all 0.25s ease;
}
.pa-entry-card:hover {
  border-color: #2A6DFF;
  box-shadow: 0 12px 40px rgba(42, 109, 255, 0.12);
  transform: translateY(-2px);
}
.pa-entry-card .entry-text h3 {
  font-size: 18px; font-weight: 700; color: #2A6DFF; margin-bottom: 6px;
}
.pa-entry-card .entry-text h3 .anticon { color: #2A6DFF; }
.pa-entry-card .entry-text p {
  font-size: 13px; color: #64748B; max-width: 520px; margin: 0;
}
.pa-entry-card .entry-btn {
  flex-shrink: 0; padding: 14px 28px; background: #2A6DFF; color: #fff;
  border-radius: 12px; font-weight: 600; font-size: 14px;
  display: inline-flex; align-items: center; gap: 10px; white-space: nowrap;
}

/* ---- pa-entry-card-sm（原型 .create-task-entry-sm lines 955-959） ---- */
.pa-entry-card-sm { padding: 18px 22px; }
.pa-entry-card-sm .entry-text h3 { font-size: 15px; margin-bottom: 0; }
.pa-entry-card-sm .entry-btn { padding: 10px 16px; font-size: 13px; }
/* ============================================================
   资料档案页 - MaterialArchivesPage.css
   ============================================================ */

/* ---- topbar ---- */
.ma-topbar {
  background: #fff;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 16px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  position: sticky;
  top: 0;
  z-index: 50;
}
.ma-topbar-left {
  display: flex;
  align-items: center;
  gap: 16px;
}
.ma-back-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #64748B;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  padding: 8px 14px;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.2s;
}
.ma-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.ma-title { font-size: 20px; font-weight: 700; margin: 0; }
.ma-sub { font-size: 13px; color: #64748B; }
.ma-badge {
  font-size: 12px;
  padding: 6px 12px;
  background: #E8F0FF;
  color: #2A6DFF;
  border-radius: 20px;
  font-weight: 500;
}

/* ---- page ---- */
.ma-page { max-width: 1280px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- stat ---- */
.ma-stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.ma-stat-card {
  background: #fff;
  border-radius: 20px;
  padding: 20px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
}
.ma-stat-val {
  font-size: 26px;
  font-weight: 700;
  color: #2A6DFF;
}
.ma-stat-val.success { color: #10B981; }
.ma-stat-val.warn { color: #F59E0B; }
.ma-stat-lbl { font-size: 13px; color: #64748B; margin-top: 4px; }

/* ---- card ---- */
.ma-card {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 24px 28px;
  margin-bottom: 24px;
}
.ma-card-head {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
.ma-card-head-title { display: flex; align-items: center; gap: 10px; color: #2A6DFF; }

/* ---- filter ---- */
.ma-filter-bar { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-bottom: 16px; }
.ma-filter-item { margin: 0; min-width: 140px; flex: 1; }
.ma-filter-item label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }

/* ---- project banner ---- */
.ma-project-banner {
  margin-top: 16px;
  padding: 16px 20px;
  background: #E8F0FF;
  border-radius: 12px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px 24px;
  font-size: 13px;
}
.ma-banner-item label { display: block; color: #64748B; font-size: 12px; margin-bottom: 4px; }

/* ---- toolbar ---- */
.ma-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }

/* ---- status badges ---- */
.status-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
}
.st-done { background: #D1FAE5; color: #059669; }
.st-pending { background: #FEF3C7; color: #D97706; }
.st-draft { background: #F1F5F9; color: #64748B; }
.st-archived { background: #E8F0FF; color: #2A6DFF; }

/* ---- file icon ---- */
.file-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  margin-right: 10px;
}
.file-ppt { background: #FEE2E2; color: #DC2626; }
.file-pdf { background: #FEE2E2; color: #B91C1C; }
.file-doc { background: #DBEAFE; color: #2563EB; }
.file-cert { background: #D1FAE5; color: #059669; }
.file-xls { background: #D1FAE5; color: #047857; }

/* ---- ledger ---- */
.ma-ledger-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}
.ma-ledger-item {
  padding: 16px;
  background: #F5F7FC;
  border-radius: 12px;
  font-size: 13px;
}
.ma-ledger-item label { display: block; color: #64748B; font-size: 12px; margin-bottom: 6px; }
.ma-ledger-item strong { font-size: 18px; color: #2A6DFF; }

/* ---- form group ---- */
.ma-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }

/* ---- approval ---- */
.ma-approval-track { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.approval-node {
  flex: 1;
  min-width: 120px;
  padding: 14px;
  border-radius: 12px;
  background: #F5F7FC;
  text-align: center;
  font-size: 13px;
}
.approval-node.done { background: #D1FAE5; color: #059669; }
.approval-node.active { background: #E8F0FF; color: #2A6DFF; font-weight: 600; }

.ma-archive-summary {
  margin-top: 20px;
  padding: 16px;
  background: #F5F7FC;
  border-radius: 12px;
  font-size: 14px;
}

/* ---- btn-success ---- */
.btn-success {
  background: #10B981;
  color: #fff;
  border-color: #10B981;
}
.btn-success:hover { background: #059669 !important; color: #fff !important; border-color: #059669 !important; }

/* ---- table tweaks ---- */
.ma-card .ant-table-thead > tr > th {
  background: #FAFBFD;
  color: #64748B;
  font-size: 12px;
  font-weight: 600;
}
/* ============================================================
   人才识别页 - TalentIdentificationPage.css
   ============================================================ */

/* ---- topbar ---- */
.ti-topbar {
  background: #fff;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 16px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  position: sticky;
  top: 0;
  z-index: 50;
}
.ti-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ti-back-link {
  display: inline-flex; align-items: center; gap: 8px;
  color: #64748B; text-decoration: none; font-size: 14px; font-weight: 500;
  padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.ti-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.ti-title { font-size: 20px; font-weight: 700; margin: 0; }
.ti-sub { font-size: 13px; color: #64748B; }
.ti-process-badge {
  font-size: 12px; padding: 6px 12px;
  background: #FFF7ED; color: #F18F01;
  border-radius: 20px; font-weight: 600;
}

/* ---- page ---- */
.ti-page { max-width: 1400px; margin: 0 auto; padding: 24px 24px 64px; }

/* ---- flow hint ---- */
.ti-flow-hint {
  padding: 14px 18px;
  background: #E8F0FF;
  border-radius: 10px;
  font-size: 13px;
  margin-bottom: 20px;
}
.ti-flow-hint strong { color: #2A6DFF; }

/* ---- stat row ---- */
.ti-stat-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}
@media (max-width: 900px) { .ti-stat-row { grid-template-columns: repeat(2, 1fr); } }
.ti-stat-card {
  background: #fff;
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  border-left: 4px solid #2A6DFF;
}
.ti-stat-card.warn { border-left-color: #F59E0B; }
.ti-stat-card.danger { border-left-color: #EF4444; }
.ti-stat-card.success { border-left-color: #10B981; }
.ti-stat-card.identify { border-left-color: #F18F01; }
.ti-stat-val { font-size: 28px; font-weight: 700; }
.ti-stat-val.red { color: #EF4444; }
.ti-stat-val.yellow { color: #F59E0B; }
.ti-stat-val.green { color: #10B981; }
.ti-stat-lbl { font-size: 13px; color: #64748B; margin-top: 6px; }

/* ---- card ---- */
.ti-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 24px;
  margin-bottom: 24px;
}

/* ---- toolbar ---- */
.ti-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.ti-toolbar-left { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ti-form-inline { display: flex; align-items: center; gap: 8px; font-size: 14px; }

/* ---- buttons ---- */
.btn-identify { background: #F18F01; color: #fff; border-color: #F18F01; }
.btn-identify:hover { background: #D97A01 !important; color: #fff !important; border-color: #D97A01 !important; }
.btn-identify:not(:hover) { background: #F18F01; color: #fff; border-color: #F18F01; }

/* ---- status badges ---- */
.status-badge {
  display: inline-block; padding: 4px 10px; border-radius: 6px;
  font-size: 12px; font-weight: 600;
}
.st-audited { background: #D1FAE5; color: #059669; }
.st-confirmed { background: #FEF3C7; color: #D97706; }
.st-pending { background: #FEE2E2; color: #DC2626; }

/* ---- actions ---- */
.ti-actions { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }

/* ---- footer ---- */
.ti-footer-actions {
  display: flex; justify-content: flex-end; gap: 12px;
  margin-top: 24px; flex-wrap: wrap;
}

/* ---- detail ---- */
.ti-detail-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 20px; flex-wrap: wrap; gap: 12px;
}
.ti-detail-header h2 { font-size: 18px; font-weight: 700; margin: 0; }

/* ---- filter tabs ---- */
.ti-filter-tabs { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.ti-filter-tab {
  padding: 8px 16px; border: 1px solid #E2E8F0; border-radius: 20px;
  background: #fff; font-size: 13px; cursor: pointer;
}
.ti-filter-tab.active { background: #F18F01; color: #fff; border-color: #F18F01; }

/* ---- form ---- */
.ti-form-group { margin-bottom: 16px; }
.ti-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }

/* ---- upload ---- */
.ti-upload-zone {
  border: 2px dashed #E2E8F0; border-radius: 10px;
  padding: 32px; text-align: center; cursor: pointer;
  transition: border-color 0.2s;
}
.ti-upload-zone:hover { border-color: #F18F01; background: #FFF7ED; }

.ti-file-preview {
  display: none; margin-top: 12px; padding: 12px;
  background: #F5F7FC; border-radius: 10px; font-size: 13px;
  justify-content: space-between; align-items: center;
}
.ti-file-preview.show { display: flex; }

/* ---- table ---- */
.ti-card .ant-table-thead > tr > th {
  background: #FAFBFD; color: #64748B; font-size: 12px; font-weight: 600;
}
/* ============================================================
   初步方案页 - PreliminaryPlanPage.css
   ============================================================ */

/* ---- topbar ---- */
.pp-topbar {
  background: #fff; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 16px 32px;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  position: sticky; top: 0; z-index: 50;
}
.pp-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.pp-back-link {
  display: inline-flex; align-items: center; gap: 8px; color: #64748B;
  text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.pp-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.pp-title { font-size: 20px; font-weight: 700; margin: 0; }
.pp-sub { font-size: 13px; color: #64748B; }
.pp-process-badge {
  font-size: 12px; padding: 6px 12px; background: #EEF2FF; color: #6366F1; border-radius: 20px; font-weight: 600;
}

/* ---- page ---- */
.pp-page { max-width: 1280px; margin: 0 auto; padding: 24px 24px 64px; }

/* ---- flow hint ---- */
.pp-flow-hint {
  padding: 14px 18px; background: #E8F0FF; border-radius: 10px; font-size: 13px; margin-bottom: 20px; line-height: 1.6;
}
.pp-flow-hint strong { color: #2A6DFF; }

/* ---- stat ---- */
.pp-stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
@media (max-width: 900px) { .pp-stat-row { grid-template-columns: repeat(2, 1fr); } }
.pp-stat-card {
  background: #fff; border-radius: 16px; padding: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); border-left: 4px solid #2A6DFF;
}
.pp-stat-card.plan { border-left-color: #6366F1; }
.pp-stat-card.warn { border-left-color: #F59E0B; }
.pp-stat-card.success { border-left-color: #10B981; }
.pp-stat-val { font-size: 26px; font-weight: 700; }
.pp-stat-lbl { font-size: 13px; color: #64748B; margin-top: 6px; }

/* ---- card ---- */
.pp-card { background: #fff; border-radius: 16px; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 24px; margin-bottom: 24px; }
.pp-card-head {
  font-size: 16px; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.pp-card-head-title { display: flex; align-items: center; gap: 10px; color: #6366F1; }
.pp-hint { font-size: 12px; color: #64748B; font-weight: 400; }

/* ---- form ---- */
.pp-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.pp-form-grid .full { grid-column: 1 / -1; }
.pp-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }
.pp-form-group { margin-bottom: 0; }

/* ---- project banner ---- */
.pp-project-banner {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px; padding: 16px; background: #F5F7FC; border-radius: 10px; margin-top: 16px;
}
.pp-banner-item label { font-size: 11px; color: #64748B; display: block; }
.pp-banner-item strong { font-size: 14px; }

/* ---- empty ---- */
.pp-empty {
  text-align: center; padding: 64px 24px; color: #64748B;
  background: #fff; border-radius: 16px; box-shadow: 0 4px 24px rgba(42,109,255,.06);
}

/* ---- toolbar ---- */
.pp-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }

/* ---- buttons ---- */
.btn-plan { background: #6366F1; color: #fff; border-color: #6366F1; }
.btn-plan:hover { background: #4F46E5 !important; color: #fff !important; border-color: #4F46E5 !important; }
.btn-plan:not(:hover) { background: #6366F1; color: #fff; border-color: #6366F1; }

/* ---- sub stats ---- */
.pp-sub-stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.pp-sub-stat { background: #F5F7FC; padding: 14px; border-radius: 10px; text-align: center; }
.pp-sub-stat-v { font-size: 22px; font-weight: 700; color: #2A6DFF; }
.pp-sub-stat-l { font-size: 12px; color: #64748B; margin-top: 4px; }

/* ---- footer ---- */
.pp-footer-actions { display: flex; justify-content: flex-end; gap: 12px; flex-wrap: wrap; margin-top: 8px; }

/* ---- status ---- */
.st-draft { background: #E2E8F0; color: #475569; }

/* ---- table ---- */
.pp-card .ant-table-thead > tr > th { background: #FAFBFD; color: #64748B; font-size: 12px; font-weight: 600; }
/* ===== Topbar ===== */
.ct-topbar {
  background: #fff;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 16px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 50;
}
.ct-topbar-left { display: flex; align-items: center; gap: 16px; }
.ct-back-link {
  display: inline-flex; align-items: center; gap: 8px;
  color: #64748b; text-decoration: none; font-size: 14px; font-weight: 500;
  padding: 8px 14px; border-radius: 12px; cursor: pointer; transition: all 0.2s;
}
.ct-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.ct-title { font-size: 20px; font-weight: 700; margin: 0; }
.ct-sub { font-size: 13px; color: #64748b; }
.ct-task-code { font-size: 12px; color: #64748b; }

/* ===== Page ===== */
.ct-page { max-width: 1100px; margin: 0 auto; padding: 32px 24px 64px; }
.ct-page.ct-page-wide { max-width: 1280px; }

/* ===== Steps Bar ===== */
.ct-steps-bar { display: flex; gap: 8px; margin-bottom: 28px; flex-wrap: wrap; }
.ct-step-pill {
  flex: 1; min-width: 140px; padding: 14px 16px;
  background: #fff; border-radius: 12px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  font-size: 13px; font-weight: 500; color: #64748b; cursor: pointer;
  border: 2px solid transparent; transition: all 0.2s;
  text-align: center; font-family: inherit;
}
.ct-step-pill.active { border-color: #2A6DFF; color: #2A6DFF; background: #E8F0FF; }
.ct-step-pill.done { color: #10B981; }
.ct-step-pill .num { font-size: 11px; display: block; opacity: 0.7; margin-bottom: 2px; }

/* ===== Section / Card ===== */
.ct-section { animation: ctFadeIn 0.3s ease; }
@keyframes ctFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.ct-card { border-radius: 20px !important; margin-bottom: 24px; }

/* ===== Form Grid ===== */
.ct-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.ct-form-grid .full { grid-column: 1 / -1; }

/* ===== Config (Step 3) ===== */
.ct-config-header {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px; margin-bottom: 20px;
}
.ct-config-progress { flex: 1; min-width: 200px; }
.ct-config-progress-label {
  font-size: 13px; color: #64748b; margin-bottom: 8px;
  display: flex; justify-content: space-between;
}
.ct-config-layout { display: grid; grid-template-columns: 220px 1fr; gap: 20px; min-height: 520px; }

/* Sidebar */
.ct-config-sidebar {
  background: #fff; border-radius: 20px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 12px; position: sticky; top: 88px; align-self: start;
  max-height: calc(100vh - 120px); overflow-y: auto;
}
.ct-config-nav-group {
  font-size: 11px; font-weight: 600; color: #64748b;
  text-transform: uppercase; letter-spacing: 0.04em; padding: 12px 12px 6px;
}
.ct-config-nav-item {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 11px 12px; border: none; background: transparent;
  border-radius: 10px; font-family: inherit; font-size: 13px;
  font-weight: 500; color: #64748b; cursor: pointer;
  text-align: left; transition: all 0.2s;
}
.ct-config-nav-item:hover { background: #E8F0FF; color: #2A6DFF; }
.ct-config-nav-item.active { background: #E8F0FF; color: #2A6DFF; font-weight: 600; }
.ct-config-nav-item .nav-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #e2e8f0; flex-shrink: 0;
}
.ct-config-nav-item.done .nav-dot { background: #10B981; }

/* Main panel */
.ct-config-main {
  background: #fff; border-radius: 20px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 28px 32px;
}
.ct-config-panel { animation: ctFadeIn 0.25s ease; }
.ct-config-panel-head { margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid #e2e8f0; }
.ct-config-panel-head h3 { font-size: 18px; font-weight: 700; margin: 0 0 6px; display: flex; align-items: center; gap: 10px; color: #1a2332; }
.ct-config-panel-head h3 :global(.anticon) { color: #2A6DFF; }
.ct-config-panel-head p { font-size: 13px; color: #64748b; margin: 0; }

/* Config form grid */
.config-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.config-form-grid .full { grid-column: 1 / -1; }

/* Panel actions */
.ct-panel-actions {
  margin-top: 24px; padding-top: 20px;
  border-top: 1px solid #e2e8f0;
  display: flex; justify-content: space-between; align-items: center;
}
.ct-panel-actions .hint { font-size: 12px; color: #64748b; }

/* Check list */
.check-list { list-style: none; padding: 0; margin: 0; }
.check-list li {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 0; font-size: 14px;
  border-bottom: 1px solid #e2e8f0;
}
.check-list li:last-child { border-bottom: none; }
.check-list li .ant-form-item { margin: 0; }

/* ===== Responsive ===== */
@media (max-width: 900px) {
  .ct-config-layout { grid-template-columns: 1fr; }
  .ct-config-sidebar { position: static; max-height: none; }
  .ct-form-grid, .config-form-grid { grid-template-columns: 1fr; }
  .ct-form-grid .full, .config-form-grid .full { grid-column: 1; }
  .ct-topbar { padding: 12px 16px; }
  .ct-step-pill { min-width: 120px; font-size: 12px; padding: 10px 12px; }
}
/* ============================================================
   最终方案页 - FinalPlanPage.css
   ============================================================ */

/* ---- topbar ---- */
.fp-topbar {
  background: #fff; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 16px 32px;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  position: sticky; top: 0; z-index: 50;
}
.fp-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.fp-back-link {
  display: inline-flex; align-items: center; gap: 8px; color: #64748B;
  text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.fp-back-link:hover { background: #D1FAE5; color: #059669; }
.fp-title { font-size: 20px; font-weight: 700; margin: 0; }
.fp-sub { font-size: 13px; color: #64748B; }
.fp-process-badge {
  font-size: 12px; padding: 6px 12px; background: #D1FAE5; color: #059669; border-radius: 20px; font-weight: 600;
}

/* ---- page ---- */
.fp-page { max-width: 1280px; margin: 0 auto; padding: 24px 24px 64px; }

/* ---- flow hint ---- */
.fp-flow-hint {
  padding: 14px 18px; background: #D1FAE5; border-radius: 10px; font-size: 13px; margin-bottom: 20px; line-height: 1.6;
}
.fp-flow-hint strong { color: #059669; }

/* ---- stat ---- */
.fp-stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
@media (max-width: 900px) { .fp-stat-row { grid-template-columns: repeat(2, 1fr); } }
.fp-stat-card {
  background: #fff; border-radius: 16px; padding: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); border-left: 4px solid #2A6DFF;
}
.fp-stat-card.final { border-left-color: #059669; }
.fp-stat-card.warn { border-left-color: #F59E0B; }
.fp-stat-card.danger { border-left-color: #EF4444; }
.fp-stat-val { font-size: 26px; font-weight: 700; }
.fp-stat-lbl { font-size: 13px; color: #64748B; margin-top: 6px; }

/* ---- card ---- */
.fp-card { background: #fff; border-radius: 16px; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 24px; margin-bottom: 24px; }
.fp-card-head {
  font-size: 16px; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.fp-card-head-title { display: flex; align-items: center; gap: 10px; color: #059669; }
.fp-hint { font-size: 12px; color: #64748B; font-weight: 400; }

/* ---- form ---- */
.fp-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.fp-form-grid .full { grid-column: 1 / -1; }
.fp-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }
.fp-form-group { margin-bottom: 0; }

/* ---- project banner ---- */
.fp-project-banner {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px; padding: 16px; background: #F5F7FC; border-radius: 10px; margin-top: 16px;
}
.fp-banner-item label { font-size: 11px; color: #64748B; display: block; }
.fp-banner-item strong { font-size: 14px; }

/* ---- empty ---- */
.fp-empty {
  text-align: center; padding: 64px 24px; color: #64748B;
  background: #fff; border-radius: 16px; box-shadow: 0 4px 24px rgba(42,109,255,.06);
}

/* ---- toolbar ---- */
.fp-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }

/* ---- locked banner ---- */
.fp-locked-banner {
  padding: 12px 16px; background: #D1FAE5; border-radius: 10px;
  font-size: 13px; margin-bottom: 16px; display: flex; align-items: center; gap: 10px;
}

/* ---- grid-2 ---- */
.fp-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 900px) { .fp-grid-2 { grid-template-columns: 1fr; } }

/* ---- checklist ---- */
.fp-checklist { list-style: none; }
.fp-checklist li {
  padding: 12px 0; border-bottom: 1px solid #E2E8F0;
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
}
.fp-checklist li:last-child { border-bottom: none; }

/* ---- sub stats ---- */
.fp-sub-stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
.fp-sub-stat { background: #F5F7FC; padding: 14px; border-radius: 10px; text-align: center; }
.fp-sub-stat-v { font-size: 22px; font-weight: 700; color: #2A6DFF; }
.fp-sub-stat-l { font-size: 12px; color: #64748B; margin-top: 4px; }

/* ---- footer ---- */
.fp-footer-actions { display: flex; justify-content: flex-end; gap: 12px; flex-wrap: wrap; margin-top: 8px; }

/* ---- buttons ---- */
.btn-final { background: #059669; color: #fff; border-color: #059669; }
.btn-final:hover { background: #047857 !important; color: #fff !important; border-color: #047857 !important; }
.btn-final:not(:hover) { background: #059669; color: #fff; border-color: #059669; }

/* ---- status ---- */
.st-ok { background: #D1FAE5; color: #059669; }
.st-warn { background: #FEF3C7; color: #D97706; }
.st-no { background: #FEE2E2; color: #DC2626; }

/* ---- table ---- */
.fp-card .ant-table-thead > tr > th { background: #FAFBFD; color: #64748B; font-size: 12px; font-weight: 600; }
/* ============================================================
   开班申报页 - ClassDeclarationPage.css
   ============================================================ */

/* ---- topbar ---- */
.kb-topbar {
  background: #fff; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 16px 32px;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  position: sticky; top: 0; z-index: 50;
}
.kb-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.kb-back-link {
  display: inline-flex; align-items: center; gap: 8px; color: #64748B;
  text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.kb-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.kb-title { font-size: 20px; font-weight: 700; margin: 0; }
.kb-sub { font-size: 13px; color: #64748B; }
.kb-process-badge {
  font-size: 12px; padding: 6px 12px; background: #E8F0FF; color: #2A6DFF; border-radius: 20px; font-weight: 500;
}

/* ---- page ---- */
.kb-page-body { max-width: 1280px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- stat ---- */
.kb-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; margin-bottom: 24px; }
.kb-stat-card { background: #fff; border-radius: 20px; padding: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); }
.kb-stat-val { font-size: 26px; font-weight: 700; color: #2A6DFF; }
.kb-stat-val.success { color: #10B981; }
.kb-stat-val.warn { color: #F59E0B; }
.kb-stat-lbl { font-size: 13px; color: #64748B; margin-top: 4px; }

/* ---- card ---- */
.kb-card { background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 24px 28px; margin-bottom: 24px; }
.kb-card-head {
  font-size: 16px; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.kb-card-head-title { display: flex; align-items: center; gap: 10px; color: #2A6DFF; }
.kb-hint { font-size: 12px; color: #64748B; font-weight: 400; }

/* ---- form ---- */
.kb-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.kb-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }
.kb-form-group-full { margin-bottom: 0; }
.kb-form-group-full label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }

/* ---- project banner ---- */
.kb-project-banner {
  margin-top: 16px; padding: 16px 20px; background: #E8F0FF; border-radius: 12px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px 24px; font-size: 13px;
}
.kb-banner-item label { display: block; color: #64748B; font-size: 12px; margin-bottom: 4px; }
.kb-banner-item strong { font-weight: 600; }

/* ---- empty ---- */
.kb-empty {
  text-align: center; padding: 48px 24px; color: #64748B;
  background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); margin-bottom: 24px;
}

/* ---- alert ---- */
.kb-alert {
  padding: 14px 18px; border-radius: 12px; font-size: 14px; margin-bottom: 20px;
  display: flex; align-items: flex-start; gap: 12px;
}
.kb-alert.warn { background: #FEF3C7; color: #92400E; }

/* ---- flow steps ---- */
.kb-flow-steps { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.kb-flow-step {
  flex: 1; min-width: 120px; text-align: center; padding: 12px 8px;
  border-radius: 12px; background: #F5F7FC; font-size: 12px; color: #64748B; position: relative;
}
.kb-flow-step.done { background: #D1FAE5; color: #059669; font-weight: 600; }
.kb-flow-step.active { background: #E8F0FF; color: #2A6DFF; font-weight: 600; }

/* ---- toolbar ---- */
.kb-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }

/* ---- footer ---- */
.kb-footer-actions { display: flex; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }

/* ---- status ---- */
.st-draft { background: #F1F5F9; color: #64748B; }
.st-prep { background: #E8F0FF; color: #2A6DFF; }
.st-submit { background: #FEF3C7; color: #D97706; }
.st-review { background: #EDE9FE; color: #7C3AED; }
.st-approved { background: #D1FAE5; color: #059669; }
.st-open { background: #059669; color: #fff; }

/* ---- action buttons ---- */
.action-btns { display: flex; gap: 6px; flex-wrap: wrap; }
.action-btn {
  width: 32px; height: 32px; border: none; border-radius: 8px;
  background: #F5F7FC; color: #64748B; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.action-btn:hover { background: #E8F0FF; color: #2A6DFF; }

/* ---- material grid ---- */
.kb-material-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.kb-material-item {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px;
  background: #F5F7FC; border-radius: 12px; font-size: 13px; cursor: pointer;
}
.kb-material-item.done { background: #D1FAE5; }
.kb-material-item input { width: auto; }

/* ---- check row ---- */
.kb-check-row { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 14px; }
.kb-check-row label { margin: 0; }

/* ---- modal form ---- */
.kb-modal-form .kb-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }

/* ---- table ---- */
.kb-card .ant-table-thead > tr > th { background: #FAFBFD; color: #64748B; font-size: 12px; font-weight: 600; }
/* ============================================================
   培训实施页 - TrainingImplementationPage.css
   ============================================================ */

/* ---- topbar ---- */
.tpx-topbar {
  background: #fff; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 16px 32px;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  position: sticky; top: 0; z-index: 50;
}
.tpx-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.tpx-back-link {
  display: inline-flex; align-items: center; gap: 8px; color: #64748B;
  text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.tpx-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.tpx-title { font-size: 20px; font-weight: 700; margin: 0; }
.tpx-sub { font-size: 13px; color: #64748B; }
.tpx-process-badge {
  font-size: 12px; padding: 6px 12px; background: #E8F0FF; color: #2A6DFF; border-radius: 20px; font-weight: 500;
}

/* ---- page ---- */
.tpx-page-body { max-width: 1280px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- stat ---- */
.tpx-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; margin-bottom: 24px; }
.tpx-stat-card { background: #fff; border-radius: 20px; padding: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); }
.tpx-stat-val { font-size: 26px; font-weight: 700; color: #2A6DFF; }
.tpx-stat-val.success { color: #10B981; }
.tpx-stat-val.warn { color: #F59E0B; }
.tpx-stat-lbl { font-size: 13px; color: #64748B; margin-top: 4px; }

/* ---- card ---- */
.tpx-card { background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 24px 28px; margin-bottom: 24px; }
.tpx-card-head {
  font-size: 16px; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.tpx-card-head-title { display: flex; align-items: center; gap: 10px; color: #2A6DFF; }
.tpx-hint { font-size: 12px; color: #64748B; font-weight: 400; }

/* ---- form ---- */
.tpx-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.tpx-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }
.tpx-form-group { margin-bottom: 0; }

/* ---- project banner ---- */
.tpx-project-banner {
  margin-top: 16px; padding: 16px 20px; background: #E8F0FF; border-radius: 12px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px 24px; font-size: 13px;
}
.tpx-banner-item label { display: block; color: #64748B; font-size: 12px; margin-bottom: 4px; }
.tpx-banner-item strong { font-weight: 600; }

/* ---- empty ---- */
.tpx-empty {
  text-align: center; padding: 48px 24px; color: #64748B;
  background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); margin-bottom: 24px;
}

/* ---- alert ---- */
.tpx-alert {
  padding: 14px 18px; border-radius: 12px; font-size: 14px; margin-bottom: 20px;
  display: flex; align-items: flex-start; gap: 12px;
}
.tpx-alert.warn { background: #FEF3C7; color: #92400E; }

/* ---- toolbar ---- */
.tpx-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; align-items: flex-end; }

/* ---- footer ---- */
.tpx-footer-actions { display: flex; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }

/* ---- progress bar ---- */
.tpx-progress-bar { height: 8px; background: #F5F7FC; border-radius: 4px; overflow: hidden; min-width: 80px; }
.tpx-progress-fill { height: 100%; background: #2A6DFF; border-radius: 4px; }

/* ---- status ---- */
.st-normal { background: #D1FAE5; color: #059669; }
.st-warn { background: #FEF3C7; color: #D97706; }
.st-danger { background: #FEE2E2; color: #DC2626; }

/* ---- action buttons ---- */
.action-btns { display: flex; gap: 6px; }
.action-btn {
  width: 32px; height: 32px; border: none; border-radius: 8px;
  background: #F5F7FC; color: #64748B; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.action-btn:hover { background: #E8F0FF; color: #2A6DFF; }

/* ---- attendance ---- */
.tpx-att-card { padding: 16px 20px; margin-bottom: 12px; border: 1px solid #E2E8F0; border-radius: 12px; }
.tpx-att-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #E2E8F0; font-size: 14px; flex-wrap: wrap; }
.tpx-att-row:last-child { border-bottom: none; }
.tpx-check-label { margin: 0; font-size: 14px; cursor: pointer; display: flex; align-items: center; gap: 4px; }
.tpx-check-label input { width: auto; }

/* ---- evidence ---- */
.tpx-evidence-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.tpx-evidence-thumb {
  aspect-ratio: 4/3; background: #F5F7FC; border-radius: 12px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; font-size: 12px; color: #64748B; border: 1px dashed #E2E8F0;
}

/* ---- logs & exceptions ---- */
.tpx-log-item, .tpx-exc-item {
  padding: 14px 16px; background: #F5F7FC; border-radius: 12px; margin-bottom: 10px; font-size: 14px;
}
.tpx-log-meta, .tpx-exc-meta { font-size: 12px; color: #64748B; margin-bottom: 6px; }

/* ---- modal ---- */
.tpx-modal-form .tpx-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }

/* ---- table ---- */
.tpx-card .ant-table-thead > tr > th { background: #FAFBFD; color: #64748B; font-size: 12px; font-weight: 600; }
/* ============================================================
   认定准备页 - CertificationPage.css
   ============================================================ */

/* ---- topbar ---- */
.rd-topbar {
  background: #fff; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 16px 32px;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  position: sticky; top: 0; z-index: 50;
}
.rd-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.rd-back-link {
  display: inline-flex; align-items: center; gap: 8px; color: #64748B;
  text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.rd-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.rd-title { font-size: 20px; font-weight: 700; margin: 0; }
.rd-sub { font-size: 13px; color: #64748B; }
.rd-process-badge {
  font-size: 12px; padding: 6px 12px; background: #E8F0FF; color: #2A6DFF; border-radius: 20px; font-weight: 500;
}

/* ---- page ---- */
.rd-page-body { max-width: 1280px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- stat ---- */
.rd-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; margin-bottom: 24px; }
.rd-stat-card { background: #fff; border-radius: 20px; padding: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); }
.rd-stat-val { font-size: 26px; font-weight: 700; color: #2A6DFF; }
.rd-stat-val.success { color: #10B981; }
.rd-stat-val.warn { color: #F59E0B; }
.rd-stat-lbl { font-size: 13px; color: #64748B; margin-top: 4px; }

/* ---- card ---- */
.rd-card { background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 24px 28px; margin-bottom: 24px; }
.rd-card-head {
  font-size: 16px; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.rd-card-head-title { display: flex; align-items: center; gap: 10px; color: #2A6DFF; }
.rd-hint { font-size: 12px; color: #64748B; font-weight: 400; }

/* ---- form ---- */
.rd-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.rd-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }
.rd-form-group { margin-bottom: 0; }

/* ---- project banner ---- */
.rd-project-banner {
  margin-top: 16px; padding: 16px 20px; background: #E8F0FF; border-radius: 12px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px 24px; font-size: 13px;
}
.rd-banner-item label { display: block; color: #64748B; font-size: 12px; margin-bottom: 4px; }
.rd-banner-item strong { font-weight: 600; }

/* ---- empty ---- */
.rd-empty {
  text-align: center; padding: 48px 24px; color: #64748B;
  background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); margin-bottom: 24px;
}

/* ---- alert ---- */
.rd-alert {
  padding: 14px 18px; border-radius: 12px; font-size: 14px; margin-bottom: 20px;
  display: flex; align-items: flex-start; gap: 12px;
}
.rd-alert.warn { background: #FEF3C7; color: #92400E; }

/* ---- flow steps ---- */
.rd-flow-steps { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.rd-flow-step {
  flex: 1; min-width: 110px; text-align: center; padding: 12px 8px;
  border-radius: 12px; background: #F5F7FC; font-size: 12px; color: #64748B;
}
.rd-flow-step.done { background: #D1FAE5; color: #059669; font-weight: 600; }
.rd-flow-step.active { background: #E8F0FF; color: #2A6DFF; font-weight: 600; }

/* ---- toolbar ---- */
.rd-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }

/* ---- filter ---- */
.rd-filter-bar { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-bottom: 16px; }

/* ---- footer ---- */
.rd-footer-actions { display: flex; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }

/* ---- status ---- */
.st-pending { background: #F1F5F9; color: #64748B; }
.st-pass { background: #D1FAE5; color: #059669; }
.st-fail { background: #FEE2E2; color: #DC2626; }
.st-ok { background: #E8F0FF; color: #2A6DFF; }
.st-rsb { background: #FEF3C7; color: #D97706; }
.st-cert { background: #059669; color: #fff; }

/* ---- action buttons ---- */
.action-btns { display: flex; gap: 6px; }
.action-btn {
  width: 32px; height: 32px; border: none; border-radius: 8px;
  background: #F5F7FC; color: #64748B; cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
}
.action-btn:hover { background: #E8F0FF; color: #2A6DFF; }

/* ---- table ---- */
.rd-card .ant-table-thead > tr > th { background: #FAFBFD; color: #64748B; font-size: 12px; font-weight: 600; }
/* ============================================================
   申报服务页 - DeclarationServicePage.css
   ============================================================ */

/* ---- topbar ---- */
.sb-topbar {
  background: #fff; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 16px 32px;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  position: sticky; top: 0; z-index: 50;
}
.sb-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.sb-back-link {
  display: inline-flex; align-items: center; gap: 8px; color: #64748B;
  text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.sb-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.sb-title { font-size: 20px; font-weight: 700; margin: 0; }
.sb-sub { font-size: 13px; color: #64748B; }
.sb-process-badge {
  font-size: 12px; padding: 6px 12px; background: #E8F0FF; color: #2A6DFF; border-radius: 20px; font-weight: 500;
}

/* ---- page ---- */
.sb-page-body { max-width: 1280px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- stat ---- */
.sb-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; margin-bottom: 24px; }
.sb-stat-card { background: #fff; border-radius: 20px; padding: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); }
.sb-stat-val { font-size: 26px; font-weight: 700; color: #2A6DFF; }
.sb-stat-val.success { color: #10B981; }
.sb-stat-val.warn { color: #F59E0B; }
.sb-stat-lbl { font-size: 13px; color: #64748B; margin-top: 4px; }

/* ---- card ---- */
.sb-card { background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 24px 28px; margin-bottom: 24px; }
.sb-card-head {
  font-size: 16px; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.sb-card-head-title { display: flex; align-items: center; gap: 10px; color: #2A6DFF; }
.sb-hint { font-size: 12px; color: #64748B; font-weight: 400; }

/* ---- form ---- */
.sb-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-bottom: 20px; }
.sb-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }
.sb-form-group { margin-bottom: 0; }

/* ---- project banner ---- */
.sb-project-banner {
  margin-top: 16px; padding: 16px 20px; background: #E8F0FF; border-radius: 12px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px 24px; font-size: 13px;
}
.sb-banner-item label { display: block; color: #64748B; font-size: 12px; margin-bottom: 4px; }
.sb-banner-item strong { font-weight: 600; }

/* ---- empty ---- */
.sb-empty {
  text-align: center; padding: 48px 24px; color: #64748B;
  background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); margin-bottom: 24px;
}

/* ---- flow steps ---- */
.sb-flow-steps { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.sb-flow-step {
  flex: 1; min-width: 120px; text-align: center; padding: 12px 8px;
  border-radius: 12px; background: #F5F7FC; font-size: 12px; color: #64748B;
}
.sb-flow-step.done { background: #D1FAE5; color: #059669; font-weight: 600; }
.sb-flow-step.active { background: #E8F0FF; color: #2A6DFF; font-weight: 600; }

/* ---- toolbar ---- */
.sb-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }

/* ---- reject box ---- */
.sb-reject-box {
  margin-top: 0; margin-bottom: 16px; padding: 14px 18px;
  background: #FEF2F2; border-radius: 12px; font-size: 14px; color: #991B1B;
}

/* ---- footer ---- */
.sb-footer-actions { display: flex; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }

/* ---- status ---- */
.st-draft { background: #F1F5F9; color: #64748B; }
.st-ready { background: #E8F0FF; color: #2A6DFF; }
.st-submit { background: #FEF3C7; color: #D97706; }
.st-pass { background: #D1FAE5; color: #059669; }
.st-reject { background: #FEE2E2; color: #DC2626; }

/* ---- table ---- */
.sb-card .ant-table-thead > tr > th { background: #FAFBFD; color: #64748B; font-size: 12px; font-weight: 600; }
/* ============================================================
   培训结业页 - GraduationPage.css
   ============================================================ */

/* ---- topbar ---- */
.jy-topbar {
  background: #fff; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 16px 32px;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  position: sticky; top: 0; z-index: 50;
}
.jy-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.jy-back-link {
  display: inline-flex; align-items: center; gap: 8px; color: #64748B;
  text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.jy-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.jy-title { font-size: 20px; font-weight: 700; margin: 0; }
.jy-sub { font-size: 13px; color: #64748B; }
.jy-process-badge {
  font-size: 12px; padding: 6px 12px; background: #E8F0FF; color: #2A6DFF; border-radius: 20px; font-weight: 500;
}

/* ---- page ---- */
.jy-page-body { max-width: 1280px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- stat ---- */
.jy-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; margin-bottom: 24px; }
.jy-stat-card { background: #fff; border-radius: 20px; padding: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); }
.jy-stat-val { font-size: 26px; font-weight: 700; color: #2A6DFF; }
.jy-stat-val.success { color: #10B981; }
.jy-stat-val.warn { color: #F59E0B; }
.jy-stat-lbl { font-size: 13px; color: #64748B; margin-top: 4px; }

/* ---- card ---- */
.jy-card { background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 24px 28px; margin-bottom: 24px; }
.jy-card-head {
  font-size: 16px; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.jy-card-head-title { display: flex; align-items: center; gap: 10px; color: #2A6DFF; }
.jy-hint { font-size: 12px; color: #64748B; font-weight: 400; }

/* ---- form ---- */
.jy-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }
.jy-form-group { margin-bottom: 0; }

/* ---- project banner ---- */
.jy-project-banner {
  margin-top: 16px; padding: 16px 20px; background: #E8F0FF; border-radius: 12px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px 24px; font-size: 13px;
}
.jy-banner-item label { display: block; color: #64748B; font-size: 12px; margin-bottom: 4px; }
.jy-banner-item strong { font-weight: 600; }

/* ---- empty ---- */
.jy-empty {
  text-align: center; padding: 48px 24px; color: #64748B;
  background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); margin-bottom: 24px;
}

/* ---- alert ---- */
.jy-alert {
  padding: 14px 18px; border-radius: 12px; font-size: 14px; margin-bottom: 20px;
  display: flex; align-items: flex-start; gap: 12px;
  background: #FEF3C7; color: #92400E;
}
.jy-alert.warn { background: #FEF3C7; color: #92400E; }

/* ---- flow steps ---- */
.jy-flow-steps { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.jy-flow-step {
  flex: 1; min-width: 120px; text-align: center; padding: 12px 8px;
  border-radius: 12px; background: #F5F7FC; font-size: 12px; color: #64748B;
}
.jy-flow-step.done { background: #D1FAE5; color: #059669; font-weight: 600; }
.jy-flow-step.active { background: #E8F0FF; color: #2A6DFF; font-weight: 600; }

/* ---- toolbar ---- */
.jy-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }

/* ---- filter ---- */
.jy-filter-bar { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-bottom: 16px; }

/* ---- footer ---- */
.jy-footer-actions { display: flex; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }

/* ---- status ---- */
.st-pending { background: #FEF3C7; color: #D97706; }
.st-done { background: #D1FAE5; color: #059669; }
.st-draft { background: #F1F5F9; color: #64748B; }

/* ---- table ---- */
.jy-card .ant-table-thead > tr > th { background: #FAFBFD; color: #64748B; font-size: 12px; font-weight: 600; }
/* ============================================================
   项目回款页 - RefundPage.css
   ============================================================ */

/* ---- topbar ---- */
.hk-topbar {
  background: #fff; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 16px 32px;
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  position: sticky; top: 0; z-index: 50;
}
.hk-topbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.hk-back-link {
  display: inline-flex; align-items: center; gap: 8px; color: #64748B;
  text-decoration: none; font-size: 14px; font-weight: 500; padding: 8px 14px; border-radius: 10px; cursor: pointer;
}
.hk-back-link:hover { background: #E8F0FF; color: #2A6DFF; }
.hk-title { font-size: 20px; font-weight: 700; margin: 0; }
.hk-sub { font-size: 13px; color: #64748B; }
.hk-process-badge {
  font-size: 12px; padding: 6px 12px; background: #FFF7ED; color: #D97706; border-radius: 20px; font-weight: 500;
}

/* ---- page ---- */
.hk-page-body { max-width: 1280px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- stat ---- */
.hk-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 16px; margin-bottom: 24px; }
.hk-stat-card { background: #fff; border-radius: 20px; padding: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); }
.hk-stat-val { font-size: 26px; font-weight: 700; color: #2A6DFF; }
.hk-stat-val.success { color: #10B981; }
.hk-stat-val.warn { color: #F59E0B; }
.hk-stat-lbl { font-size: 13px; color: #64748B; margin-top: 4px; }

/* ---- card ---- */
.hk-card { background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); padding: 24px 28px; margin-bottom: 24px; }
.hk-card-head {
  font-size: 16px; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px;
}
.hk-card-head-title { display: flex; align-items: center; gap: 10px; color: #2A6DFF; }
.hk-hint { font-size: 12px; color: #64748B; font-weight: 400; }

/* ---- form ---- */
.hk-form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 8px; }
.hk-form-group { margin-bottom: 0; }
.hk-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-bottom: 20px; }

/* ---- project banner ---- */
.hk-project-banner {
  margin-top: 16px; padding: 16px 20px; background: #E8F0FF; border-radius: 12px;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px 24px; font-size: 13px;
}
.hk-banner-item label { display: block; color: #64748B; font-size: 12px; margin-bottom: 4px; }
.hk-banner-item strong { font-weight: 600; }

/* ---- empty ---- */
.hk-empty {
  text-align: center; padding: 48px 24px; color: #64748B;
  background: #fff; border-radius: 20px; box-shadow: 0 4px 24px rgba(42,109,255,.06); margin-bottom: 24px;
}

/* ---- alert ---- */
.hk-alert {
  padding: 14px 18px; border-radius: 12px; font-size: 14px; margin-bottom: 20px;
  display: flex; align-items: flex-start; gap: 12px;
  background: #FEF3C7; color: #92400E;
}

/* ---- flow steps ---- */
.hk-flow-steps { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.hk-flow-step {
  flex: 1; min-width: 120px; text-align: center; padding: 12px 8px;
  border-radius: 12px; background: #F5F7FC; font-size: 12px; color: #64748B;
}
.hk-flow-step.done { background: #D1FAE5; color: #059669; font-weight: 600; }
.hk-flow-step.active { background: #E8F0FF; color: #2A6DFF; font-weight: 600; }

/* ---- toolbar ---- */
.hk-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }

/* ---- footer ---- */
.hk-footer-actions { display: flex; gap: 12px; justify-content: flex-end; flex-wrap: wrap; }

/* ---- settlement ---- */
.hk-settlement-empty { text-align: center; padding: 32px; color: #64748B; }
.hk-settlement-box {
  padding: 20px; background: #F5F7FC; border-radius: 12px; margin-top: 0;
}
.hk-settlement-row {
  display: flex; justify-content: space-between; padding: 10px 0;
  border-bottom: 1px dashed #E2E8F0; font-size: 14px;
}
.hk-settlement-row:last-child { border-bottom: none; }
.hk-settlement-total { font-weight: 700; font-size: 16px; }

/* ---- approval track ---- */
.hk-approval-track { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.hk-approval-node {
  flex: 1; min-width: 140px; padding: 14px; border-radius: 12px;
  background: #F5F7FC; text-align: center; font-size: 13px;
}
.hk-approval-node.done { background: #D1FAE5; color: #059669; }
.hk-approval-node.active { background: #E8F0FF; color: #2A6DFF; font-weight: 600; }

/* ---- status ---- */
.st-pending { background: #FEF3C7; color: #D97706; }
.st-done { background: #D1FAE5; color: #059669; }
.st-overdue { background: #FEE2E2; color: #DC2626; }
.st-partial { background: #E8F0FF; color: #2A6DFF; }

/* ---- table ---- */
.hk-card .ant-table-thead > tr > th { background: #FAFBFD; color: #64748B; font-size: 12px; font-weight: 600; }
/* ============================================================
   Archive Pages —— 对照原型 archive-page.css 原封不动照搬
   原型: D:\Users\admin\Desktop\培训部新版原型图\HTML\archive-page.css
   ============================================================ */

/* ---- page（原型 .page line 47） ---- */
.pa-page { max-width: 1400px; margin: 0 auto; padding: 28px 24px 64px; }

/* ---- topbar（原型 .topbar lines 21-46） ---- */
.pa-topbar {
  background: #fff;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 16px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  position: sticky;
  top: 0;
  z-index: 50;
  margin: -28px -24px 0;
}
.pa-topbar-left { display: flex; align-items: center; gap: 16px; }
.pa-topbar-left h1 { font-size: 20px; font-weight: 700; }
.pa-sub { font-size: 13px; color: #64748B; display: block; margin-top: 2px; }
.pa-topbar-tag {
  font-size: 12px; padding: 6px 12px; background: #E8F0FF;
  color: #2A6DFF; border-radius: 20px; font-weight: 500;
}

/* ---- back-link（原型 .back-link lines 35-40） ---- */
.pa-back-link {
  display: inline-flex; align-items: center; gap: 8px;
  color: #64748B; text-decoration: none; font-size: 14px; font-weight: 500;
  padding: 8px 14px; border-radius: 12px; cursor: pointer; transition: all 0.2s;
}
.pa-back-link:hover { background: #E8F0FF; color: #2A6DFF; }

/* ---- main（原型 page 内部无额外 gap） ---- */
.pa-main { }

/* ---- hint-card（原型 .hint-card lines 48-57） ---- */
.pa-hint-card {
  background: #E8F0FF;
  border-radius: 20px;
  padding: 16px 20px;
  font-size: 13px;
  color: #64748B;
  margin-bottom: 20px;
  line-height: 1.7;
}
.pa-hint-card strong { color: #1A2332; }

/* ---- stat-row（原型 .stat-row lines 58-63） ---- */
.pa-stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

/* ---- stat-card（原型 .stat-card lines 64-74） ---- */
.pa-stat-card {
  background: #fff;
  border-radius: 20px;
  padding: 16px 18px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  border-left: 3px solid #2A6DFF;
}
.pa-stat-card.warn { border-left-color: #F59E0B; }
.pa-stat-card.danger { border-left-color: #EF4444; }
.pa-stat-val { font-size: 22px; font-weight: 700; color: #2A6DFF; }
.pa-stat-lbl { font-size: 12px; color: #64748B; margin-top: 4px; }

/* ---- card（原型 .card lines 75-81） ---- */
.pa-card {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
  padding: 24px 28px;
  margin-bottom: 24px;
}

/* ---- card-head（原型 .card-head lines 82-94） ---- */
.pa-card-head {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
.pa-card-head .pa-title-wrap { display: flex; align-items: center; gap: 10px; }
.pa-card-head .pa-title-wrap .anticon { color: #2A6DFF; }

/* ---- tab-bar（原型 .tab-bar lines 125-138） ---- */
.pa-tab-bar {
  display: flex; gap: 8px; margin-bottom: 20px; flex-wrap: wrap;
  border-bottom: 1px solid #E2E8F0;
}
.pa-tab-btn {
  padding: 12px 20px; border: none; background: none;
  font-family: inherit; font-size: 14px; font-weight: 500;
  color: #64748B; cursor: pointer;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
  display: flex; align-items: center; gap: 8px; transition: all 0.2s;
}
.pa-tab-btn:hover { color: #2A6DFF; }
.pa-tab-btn.active { color: #2A6DFF; border-bottom-color: #2A6DFF; font-weight: 600; }

/* ---- filter-chips（原型 .filter-chips lines 139-154） ---- */
.pa-filter-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.pa-filter-chip {
  padding: 6px 12px; border: 1px solid #E2E8F0; border-radius: 20px;
  background: #fff; font-size: 12px; cursor: pointer;
  color: #64748B; font-family: inherit; transition: all 0.2s;
  display: inline-flex; align-items: center; gap: 0;
}
.pa-filter-chip:hover { border-color: #2A6DFF; color: #2A6DFF; }
.pa-filter-chip.active {
  border-color: #2A6DFF; background: #E8F0FF; color: #2A6DFF; font-weight: 600;
}
.pa-chip-count {
  display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px;
  background: #f1f5f9; border-radius: 10px; font-size: 11px; text-align: center;
}

/* ---- toolbar（原型 .toolbar lines 95-96） ---- */
.pa-toolbar {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 16px;
}
.pa-toolbar-actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }

/* ---- search-input（原型 .search-input lines 97-105） ---- */
.pa-search-input {
  min-width: 220px;
}
.pa-search-input .ant-input {
  padding: 10px 14px;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  font-size: 14px;
}

/* ---- table-wrap（原型 .table-wrap line 155） ---- */
.pa-table-wrap { overflow-x: auto; }

/* ---- Ant Design table overrides (match prototype .data-table) ---- */
.pa-table-wrap .ant-table {
  font-size: 14px;
}
.pa-table-wrap .ant-table-thead > tr > th {
  padding: 12px 14px;
  font-size: 12px;
  color: #64748B;
  background: #FAFBFD;
  border-bottom: 2px solid #E2E8F0;
  white-space: nowrap;
}
.pa-table-wrap .ant-table-tbody > tr > td {
  padding: 14px;
  border-bottom: 1px solid #E2E8F0;
}
.pa-table-wrap .ant-table-tbody > tr:hover > td {
  background: rgba(42, 109, 255, 0.02);
}
.pa-table-wrap .ant-table-tbody tr.row-warn > td {
  background: #FEF2F2;
}

/* ---- link（原型 .link-file lines 190-191） ---- */
.pa-link { color: #2A6DFF; cursor: pointer; text-decoration: none; }
.pa-link:hover { text-decoration: underline; }

/* ---- rule-preview（原型 .rule-preview lines 185-189） ---- */
.pa-rule-preview {
  margin-top: 16px; padding: 16px 20px; background: #F5F7FC;
  border-radius: 12px; font-size: 13px; line-height: 1.8;
}
.pa-rule-preview h4 { font-size: 14px; color: #2A6DFF; margin-bottom: 8px; }
.pa-rule-preview p { margin: 0; }

/* ---- grid-2（原型 .grid-2 lines 183-184） ---- */
.pa-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 900px) { .pa-grid-2 { grid-template-columns: 1fr; } }

/* ---- pm-sheet（原型 archive-pm-sheet.css） ---- */
.pa-pm-sheet-wrap { margin-bottom: 24px; }
.pa-pm-section-head {
  background: #c5d9f1;
  color: #1a2332;
  font-weight: 600;
  font-size: 14px;
  padding: 10px 14px;
  border: 1px solid #94a3b8;
  border-bottom: none;
}
.pa-pm-sheet {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  background: #fff;
  margin-bottom: 0;
}
.pa-pm-sheet th,
.pa-pm-sheet td {
  border: 1px solid #94a3b8;
  padding: 10px 12px;
  vertical-align: middle;
}
.pa-pm-sheet th.pa-pm-label {
  background: #e8f0fe;
  font-weight: 600;
  width: 120px;
  text-align: left;
  white-space: nowrap;
}
.pa-pm-sheet input,
.pa-pm-sheet select,
.pa-pm-sheet textarea {
  width: 100%;
  border: 1px solid #E2E8F0;
  border-radius: 6px;
  padding: 8px 10px;
  font-family: inherit;
  font-size: 13px;
}
.pa-pm-sheet textarea { min-height: 72px; resize: vertical; }
.pa-pm-hint {
  font-size: 12px;
  color: #64748B;
  padding: 8px 12px;
  background: #fafbfc;
  border: 1px solid #94a3b8;
  border-top: none;
  line-height: 1.6;
}
.pa-pm-criteria {
  font-size: 12px;
  line-height: 1.8;
  padding: 12px 14px;
  background: #fafbfc;
  border: 1px solid #94a3b8;
  border-top: none;
}
.pa-pm-sub-toolbar {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 8px 0;
}
.pa-list-panel .pa-record-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  margin-bottom: 10px;
  background: #fff;
  transition: all 0.2s;
}
.pa-list-panel .pa-record-card:hover {
  border-color: #2A6DFF;
  box-shadow: 0 4px 24px rgba(42, 109, 255, 0.06);
}
.pa-list-panel .pa-record-card h4 { font-size: 15px; margin-bottom: 4px; }
.pa-list-panel .pa-record-card p { font-size: 12px; color: #64748B; }
.pa-form-actions-bar {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
/* 组卷计划页 - 工种-科目树视觉调优
 * 解决 antd v5 Tree blockNode=true 时 style.backgroundColor 不生效的问题,
 * 用更高优先级的 .selected 标记 + CSS !important 强制覆盖 antd token
 */

.work-type-tree {
  /* 选中节点:蓝色背景 + 白字 + 微圆角 */
  .ant-tree-node-selected {
    background-color: #1677ff !important;
    border-radius: 6px;
  }

  /* 让整个节点区域(包括 icon)都跟随背景色 */
  .ant-tree-node-selected .ant-tree-node-content-wrapper,
  .ant-tree-node-selected .ant-tree-iconEle {
    background-color: #1677ff !important;
    color: #fff !important;
  }

  /* hover 时给个浅灰提示,避开选中态 */
  .ant-tree-node-content-wrapper:hover {
    background-color: rgba(0, 0, 0, 0.04);
  }
  .ant-tree-node-selected .ant-tree-node-content-wrapper:hover {
    background-color: #4096ff !important;
  }

  /* 工种节点的标题列加粗 */
  .ant-tree-switcher,
  .ant-tree-node-content-wrapper {
    transition: background-color 0.15s ease;
  }

  /* 缩进增加,层级更清楚 */
  .ant-tree-indent-unit {
    width: 16px;
  }

  /* 节点标题列强制单行 + 超出截断,避免「母液蒸发工初 / 级」这种换行 */
  .ant-tree-title {
    display: inline-block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
  }
}.assessor-tablet-shell {
  min-height: 100vh;
  background: #eef3f8;
  color: #172033;
}

.assessor-tablet-header {
  position: sticky;
  z-index: 20;
  top: 0;
  display: flex;
  min-height: 82px;
  align-items: center;
  justify-content: space-between;
  padding: 14px 24px;
  border-bottom: 1px solid #dbe4ee;
  background: rgba(255, 255, 255, 0.97);
}

.assessor-tablet-header h3.ant-typography {
  margin: 0;
}

.assessor-tablet-main {
  display: grid;
  min-height: calc(100vh - 82px);
  grid-template-columns: 330px minmax(0, 1fr);
}

.assessor-task-list {
  border-right: 1px solid #dbe4ee;
  background: #fff;
}

.assessor-task-list-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px;
  border-bottom: 1px solid #edf1f5;
}

.assessor-task-list-title h4.ant-typography {
  margin: 0;
}

.assessor-task-list .ant-list-item {
  min-height: 112px;
  padding: 16px 18px;
  cursor: pointer;
}

.assessor-task-list .ant-list-item.selected {
  border-inline-end: 4px solid #1677ff;
  background: #eaf3ff;
}

.assessor-task-card {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 8px;
}

.assessor-task-card small {
  color: #64748b;
}

.assessor-score-workspace {
  padding: 20px 24px 130px;
}

.assessor-candidate-bar,
.assessor-question-card,
.assessor-score-item,
.assessor-note {
  padding: 20px;
  border: 1px solid #dbe4ee;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(30, 55, 90, 0.05);
}

.assessor-candidate-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.assessor-candidate-bar h3.ant-typography {
  margin: 2px 0;
}

.assessor-live-score {
  min-width: 128px;
  text-align: center;
}

.assessor-exam-stats {
  display: flex;
  align-items: center;
  gap: 22px;
  text-align: center;
}

.assessor-exam-stats > div {
  min-width: 112px;
}

.assessor-live-score span,
.assessor-live-score strong,
.assessor-exam-stats span,
.assessor-exam-stats strong {
  display: block;
}

.assessor-live-score strong {
  color: #1677ff;
  font-size: 42px;
  line-height: 48px;
}

.assessor-live-score small {
  color: #64748b;
  font-size: 20px;
}

.assessor-exam-stats span {
  color: #64748b;
}

.assessor-exam-stats strong {
  color: #172033;
  font-size: 28px;
  line-height: 34px;
}

.assessor-question-card {
  margin: 14px 0;
}

.assessor-question-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.assessor-question-nav button {
  display: grid;
  min-height: 118px;
  gap: 6px;
  padding: 12px;
  border: 1px solid #dbe4ee;
  border-radius: 8px;
  background: #fff;
  color: #172033;
  text-align: left;
}

.assessor-question-nav button.active {
  border-color: #1677ff;
  background: #eaf3ff;
  box-shadow: inset 0 0 0 1px #1677ff;
}

.assessor-question-nav span,
.assessor-question-nav small {
  color: #64748b;
}

.assessor-question-nav strong {
  display: -webkit-box;
  min-height: 42px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 21px;
}

.assessor-question-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.assessor-question-score {
  min-width: 132px;
  text-align: right;
}

.assessor-question-score span,
.assessor-question-score strong {
  display: block;
}

.assessor-question-score span {
  color: #64748b;
}

.assessor-question-score strong {
  color: #1677ff;
  font-size: 24px;
}

.assessor-start-gate {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 28px;
  margin-bottom: 20px;
  border: 2px solid #1677ff;
  border-radius: 18px;
  background: #f0f7ff;
  text-align: center;
}

.assessor-start-steps {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}

.assessor-start-gate .ant-btn {
  min-width: 320px;
  min-height: 56px;
  font-size: 18px;
}

.assessor-question-card h3.ant-typography {
  margin-top: 0;
}

.assessor-prepare-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.assessor-prepare-grid div {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px;
  border-radius: 12px;
  background: #f5f8fc;
}

.assessor-progress-row {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  align-items: center;
  margin: 20px 0 12px;
}

.assessor-score-items {
  display: grid;
  gap: 14px;
}

.assessor-score-item-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 16px;
}

.assessor-score-item-head > div {
  display: flex;
  align-items: center;
  flex: 1 1 240px;
  min-width: 0;
  gap: 10px;
}

.assessor-score-item-head h4.ant-typography {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.assessor-score-item-head > strong {
  flex: 0 0 auto;
  margin-left: auto;
  color: #1677ff;
  font-size: 24px;
  white-space: nowrap;
}

.assessor-item-no {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 10px;
  background: #1677ff;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}

.assessor-deduction-control {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 130px minmax(180px, 1fr);
  gap: 14px;
  align-items: stretch;
  margin: 16px 0;
}

.assessor-deduction-control .ant-btn {
  height: 58px;
  font-size: 17px;
  font-weight: 700;
}

.assessor-deduction-control > div {
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: #fff7e6;
}

.assessor-deduction-control span,
.assessor-deduction-control strong {
  display: block;
}

.assessor-deduction-control strong {
  color: #d4380d;
  font-size: 26px;
}

.assessor-note {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.assessor-submit-bar {
  position: fixed;
  z-index: 30;
  right: 0;
  bottom: 0;
  left: 330px;
  display: flex;
  min-height: 96px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 28px;
  border-top: 1px solid #dbe4ee;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 -8px 24px rgba(30, 55, 90, 0.08);
}

.assessor-submit-bar span,
.assessor-submit-bar strong {
  display: block;
}

.assessor-submit-bar strong {
  color: #1677ff;
  font-size: 34px;
}

.assessor-submit-bar .ant-btn {
  min-width: 180px;
  height: 58px;
  font-size: 18px;
  font-weight: 700;
}

.assessor-mobile-back {
  display: none;
}

@media (max-width: 900px), (orientation: portrait) {
  .assessor-tablet-header {
    padding: 12px 16px;
  }

  .assessor-tablet-main {
    display: block;
  }

  .assessor-tablet-main.has-selection .assessor-task-list {
    display: none;
  }

  .assessor-tablet-main:not(.has-selection) .assessor-score-workspace {
    display: none;
  }

  .assessor-task-list {
    border-right: 0;
  }

  .assessor-score-workspace {
    padding: 14px 14px 120px;
  }

  .assessor-candidate-bar,
  .assessor-question-title-row,
  .assessor-exam-stats {
    align-items: flex-start;
    flex-direction: column;
  }

  .assessor-exam-stats {
    width: 100%;
    gap: 10px;
    text-align: left;
  }

  .assessor-question-score {
    text-align: left;
  }

  .assessor-question-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .assessor-mobile-back {
    display: inline-flex;
    height: 46px;
    margin-bottom: 12px;
  }

  .assessor-submit-bar {
    left: 0;
    min-height: 88px;
    padding: 10px 16px;
    flex-wrap: wrap;
  }

  .assessor-submit-bar .ant-btn {
    min-width: 0;
    flex: 1 1 150px;
  }

  .assessor-prepare-grid,
  .assessor-deduction-control {
    grid-template-columns: 1fr;
  }

  .assessor-deduction-control > div {
    min-height: 64px;
  }
}
.cert-dashboard {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cert-dashboard .dashboard-filter-card .ant-card-body {
  padding-bottom: 8px;
}

.cert-dashboard-kpis {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}

.cert-dashboard-kpi {
  min-height: 126px;
  border: 1px solid #e8edf5;
  border-radius: 12px;
  background: linear-gradient(145deg, #ffffff 0%, #f8fbff 100%);
  padding: 16px;
}

.cert-dashboard-kpi-label {
  color: #64748b;
  font-size: 13px;
}

.cert-dashboard-kpi-value {
  margin-top: 8px;
  color: #172033;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.2;
}

.cert-dashboard-kpi-foot {
  margin-top: 10px;
  color: #7b8798;
  font-size: 12px;
}

.cert-dashboard-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.cert-dashboard-chart {
  height: 320px;
}

.cert-dashboard-resource-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.cert-dashboard-resource {
  border: 1px solid #e6ebf2;
  border-radius: 12px;
  padding: 16px;
  background: #fff;
}

.cert-dashboard-resource-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  font-weight: 600;
}

.cert-dashboard-resource-total {
  color: #172033;
  font-size: 26px;
  font-weight: 700;
}

.cert-dashboard-resource-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
  color: #64748b;
  font-size: 12px;
}

@media (max-width: 1400px) {
  .cert-dashboard-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1000px) {
  .cert-dashboard-chart-grid,
  .cert-dashboard-resource-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .cert-dashboard-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* 实操评分·展开行：三考评员卡片布局 */

.practical-candidate-assessors {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 4px 4px 4px 32px; /* 给行首展开箭头留出位置 */
}

.practical-candidate-assessor {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px 16px;
  border: 1px solid #dbe4ee;
  border-radius: 12px;
  background: #f9fbfd;
  min-height: 120px;
}

.practical-candidate-assessor--empty {
  align-items: center;
  justify-content: center;
  background: #f5f7fa;
  color: #94a3b8;
  font-size: 13px;
}

.practical-assessor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.practical-assessor-head .assessor-name {
  font-size: 15px;
  font-weight: 600;
  color: #172033;
}

.practical-assessor-progress {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #64748b;
}

.practical-assessor-tasks {
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-top: 1px dashed #dbe4ee;
  padding-top: 8px;
}

.practical-assessor-task {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 13px;
  color: #334155;
}

.practical-assessor-task.is-review-required {
  margin: 0 -6px;
  padding: 6px;
  border: 1px solid #ffccc7;
  border-radius: 6px;
  background: #fff2f0;
}

.practical-assessor-task .task-title {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.practical-assessor-task .task-score {
  flex: 0 0 auto;
  font-weight: 600;
  color: #1677ff;
}

.practical-assessor-total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  border-top: 1px solid #dbe4ee;
  padding-top: 8px;
  font-size: 13px;
  color: #64748b;
}

.practical-assessor-total strong {
  font-size: 20px;
  color: #1677ff;
  font-weight: 700;
}

@media (max-width: 900px) {
  .practical-candidate-assessors {
    grid-template-columns: 1fr;
    padding-left: 4px;
  }
}
/* Design tokens derived from prototype HTML — applied globally */
:root {
  /* Semantic palette (light) */
  --color-bg: #f8fafc;
  --color-panel: #ffffff;
  --color-card: #f1f5f9;
  --color-text: #1e293b;
  --color-muted: #64748b;
  --color-line: #e2e8f0;
  --color-brand: #3b82f6;
  --color-brand-light: #eff6ff;
  --color-ok: #10b981;
  --color-warn: #f59e0b;
  --color-bad: #ef4444;
  --color-chip: #e2e8f0;

  /* Shadow */
  --shadow-card: 0 1px 2px 0 rgba(0,0,0,0.03), 0 1px 6px -1px rgba(0,0,0,0.02), 0 2px 4px 0 rgba(0,0,0,0.02);
  --shadow-elevated: 0 6px 16px 0 rgba(0,0,0,0.08), 0 3px 6px -4px rgba(0,0,0,0.06), 0 9px 28px 8px rgba(0,0,0,0.05);
  --shadow-modal: 0 20px 60px rgba(0,0,0,0.15);

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 14px;
  --radius-pill: 999px;

  /* Typography */
  --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-width: 1180px;
  background: #f8fafc;
  color: #1e293b;
}

.app-shell {
  min-height: 100vh;
}

/* ---- Sider / Sidebar ---- */
.app-sider {
  background: #ffffff !important;
  border-right: 1px solid #e2e8f0;
}

.brand-block {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 68px;
  padding: 0 18px;
  border-bottom: 1px solid #f1f5f9;
}

.brand-mark,
.login-mark {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 8px;
  background: radial-gradient(60% 60% at 30% 30%, #93c5fd 0%, #3b82f6 50%, #1d4ed8 100%);
  box-shadow: 0 8px 16px rgba(59, 130, 246, 0.25);
  color: #fff;
  font-weight: 700;
}

.brand-name {
  display: block;
  color: #1e293b;
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
}

.brand-sub {
  display: block;
  color: #64748b;
  font-size: 11px;
  line-height: 16px;
}

/* ---- Menu ---- */
.app-menu {
  padding: 10px 8px;
  background: transparent;
  border: 0 !important;
}

.app-sider .app-menu.ant-menu .ant-menu-item {
  height: 38px;
  margin: 3px 0;
  color: #64748b !important;
  border-radius: 8px;
  transition: background-color 0.16s ease, color 0.16s ease;
}

.app-sider .app-menu.ant-menu .ant-menu-item .ant-menu-title-content,
.app-sider .app-menu.ant-menu .ant-menu-item .anticon {
  color: inherit !important;
}

/* Truncate long menu labels with ellipsis so the hover tooltip has something to reveal. */
.app-sider .app-menu.ant-menu .app-menu-label {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}

.app-sider .app-menu.ant-menu .ant-menu-item:not(.ant-menu-item-selected):hover,
.app-sider .app-menu.ant-menu .ant-menu-item:not(.ant-menu-item-selected).ant-menu-item-active {
  background: rgba(59, 130, 246, 0.08) !important;
  color: #1e293b !important;
}

.app-sider .app-menu.ant-menu .ant-menu-item-selected {
  background: rgba(59, 130, 246, 0.12) !important;
  color: #1e293b !important;
}

.app-sider .app-menu.ant-menu .ant-menu-item-selected:hover {
  background: rgba(59, 130, 246, 0.18) !important;
}

/* ---- Header ---- */
.app-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 58px;
  padding: 0 24px;
  background: rgba(255, 255, 255, 0.94);
  border-bottom: 1px solid #e2e8f0;
  backdrop-filter: blur(10px);
}

.top-search {
  width: 340px;
}

.user-meta {
  display: flex;
  flex-direction: column;
  color: #1e293b;
  font-size: 13px;
  line-height: 16px;
}

.user-meta small {
  color: #64748b;
  font-size: 12px;
}

/* ---- Content ---- */
.app-content {
  padding: 24px;
}

.knowledge-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.page-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.knowledge-heading {
  min-height: 118px;
  padding: 22px 24px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background:
    radial-gradient(circle at 86% 18%, rgba(59, 130, 246, 0.08), transparent 32%),
    linear-gradient(135deg, #ffffff 0%, #f8fbff 64%, #eff6ff 100%);
  box-shadow: 0 12px 30px rgba(16, 24, 40, 0.05);
}

.page-title-line {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.page-title-icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border-radius: 10px;
  background: #3b82f6;
  color: #fff;
  box-shadow: 0 10px 18px rgba(59, 130, 246, 0.2);
}

.page-heading h1.ant-typography {
  margin: 0;
  font-size: 26px;
  line-height: 34px;
  letter-spacing: 0;
}

/* ---- Overview cards ---- */
.knowledge-overview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.overview-card.ant-pro-card {
  border-color: #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.04);
}

.overview-card .ant-statistic-title {
  color: #64748b;
  font-size: 13px;
}

.overview-card .ant-statistic-content {
  color: #1e293b;
  font-size: 25px;
  font-weight: 700;
}

.overview-card .ant-statistic-content-prefix {
  margin-inline-end: 8px;
  color: #3b82f6;
  font-size: 20px;
}

/* ---- Knowledge grid ---- */
.knowledge-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 356px;
  gap: 16px;
  align-items: start;
}

.knowledge-main {
  min-width: 0;
}

.pro-work-section.ant-pro-card {
  min-height: 430px;
  border-color: #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(16, 24, 40, 0.05);
}

.pro-work-section .ant-pro-card-header {
  padding-block: 16px;
  border-bottom: 1px solid #f1f5f9;
}

.pro-work-section .ant-pro-card-title {
  color: #1e293b;
  font-size: 16px;
  font-weight: 700;
}

.pro-work-section .ant-pro-card-body {
  padding: 0 18px 18px;
}

.section-search {
  width: 340px;
}

.work-tabs {
  margin-bottom: 4px;
}

.work-tabs .ant-tabs-nav {
  margin-bottom: 14px;
}

.section-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 0;
}

.section-title-row h3.ant-typography,
.knowledge-inspector h3.ant-typography,
.knowledge-inspector h4.ant-typography,
.result-list h4.ant-typography,
.answer-panel h4.ant-typography {
  margin: 0;
  letter-spacing: 0;
}

/* ---- Table ---- */
.ant-table-wrapper .ant-table {
  color: #1e293b;
  border-radius: 8px;
}

.ant-table-wrapper .ant-table-thead > tr > th {
  color: #475569;
  font-size: 13px;
  font-weight: 600;
}

.ant-table-wrapper .ant-table-tbody > tr > td {
  border-bottom-color: #f1f5f9;
}

.selected-row td {
  background: #eff6ff !important;
}

.name-cell {
  display: flex;
  align-items: center;
  gap: 12px;
}

.name-cell > span:last-child {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.name-cell-icon {
  display: grid;
  width: 36px;
  height: 36px;
  flex: none;
  place-items: center;
  border-radius: 9px;
  background: #eff6ff;
  color: #3b82f6;
}

.name-cell-icon.file {
  background: #f0fdf4;
  color: #10b981;
}

/* ---- Inspector sidebar ---- */
.knowledge-inspector {
  position: sticky;
  top: 78px;
  padding: 18px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(16, 24, 40, 0.05);
}

.inspector-title {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 16px;
}

.inspector-title > .anticon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 10px;
  background: #eff6ff;
  color: #3b82f6;
  font-size: 18px;
}

.inspector-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 16px;
}

.metric-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 18px;
}

.metric-strip div {
  padding: 11px 10px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}

.metric-strip strong,
.metric-strip span {
  display: block;
}

.metric-strip strong {
  color: #3b82f6;
  font-size: 22px;
  line-height: 27px;
}

.metric-strip span {
  color: #64748b;
  font-size: 12px;
}

.permission-section {
  padding: 16px 0;
  border-top: 1px solid #f1f5f9;
  border-bottom: 1px solid #f1f5f9;
}

.permission-section h4.ant-typography {
  margin-bottom: 12px;
}

.index-timeline {
  margin-top: 18px;
}

/* ---- Search workspace ---- */
.search-workspace {
  min-height: 380px;
  padding-top: 18px;
}

.search-command {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 110px 150px;
  gap: 12px;
  align-items: end;
  padding: 14px;
  margin-bottom: 16px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.search-input-item {
  margin-bottom: 0;
}

.search-command .ant-form-item {
  margin-bottom: 0;
}

.search-result-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap: 14px;
}

.result-list,
.answer-panel {
  min-height: 390px;
  padding: 16px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
}

.citation-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  padding: 13px 0;
  border-bottom: 1px solid #f1f5f9;
}

.citation-row p {
  margin: 6px 0 0;
  color: #475569;
  font-size: 13px;
  line-height: 21px;
}

.citation-score {
  display: grid;
  width: 34px;
  height: 30px;
  place-items: center;
  border-radius: 8px;
  background: #eff6ff;
  color: #3b82f6;
  font-weight: 700;
}

.answer-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  color: #3b82f6;
}

.answer-panel .ant-alert {
  margin-bottom: 12px;
}

.answer-panel .ant-typography {
  color: #334155;
  font-size: 14px;
  line-height: 24px;
  white-space: pre-wrap;
}

.upload-zone {
  margin-bottom: 16px;
}

/* ---- Login ---- */
.login-screen,
.boot-screen {
  display: grid;
  min-height: 100vh;
  place-items: center;
  background: #f8fafc;
}

.boot-screen {
  color: #64748b;
}

.login-panel {
  width: 410px;
  padding: 26px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(16, 24, 40, 0.05);
}

.login-title-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 22px;
}

.login-title-row h2.ant-typography {
  margin: 0 0 2px;
  font-size: 22px;
}

/* ---- Responsive ---- */
@media (max-width: 1180px) {
  body {
    min-width: 0;
  }

  .knowledge-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .knowledge-grid,
  .search-result-grid {
    grid-template-columns: 1fr;
  }

  .knowledge-inspector {
    position: static;
  }
}

@media (max-width: 900px) {
  .app-sider {
    display: none;
  }

  .app-header {
    padding: 0 12px;
  }

  .top-search {
    display: none;
  }

  .app-content {
    padding: 14px;
  }

  .page-heading,
  .section-title-row {
    flex-direction: column;
  }

  .knowledge-overview,
  .search-command {
    grid-template-columns: 1fr;
  }

  .section-search {
    width: 100%;
  }
}