/*
 * v1.1.28 · 企业工作台清晰型排版系统
 * 作为最后加载的字体层，将历史模块的零散字号归并为语义化层级。
 * 原则：业务信息不低于 12px；正文与表单使用 14px；移动端不缩小正文。
 */

@media screen {
:root {
    --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
    --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;

    --text-meta: 12px;
    --text-small: 13px;
    --text-body: 14px;
    --text-control: 14px;
    --text-emphasis: 16px;
    --text-card-title: 20px;
    --text-section-title: 24px;
    --text-page-title: clamp(28px, 2.2vw, 32px);
    --text-display: clamp(30px, 2.6vw, 36px);

    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;

    --line-title: 1.25;
    --line-compact: 1.45;
    --line-body: 1.6;
  }

  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  body,
  button,
  input,
  textarea,
  select {
    font-family: var(--font-sans);
  }

  body {
    font-size: var(--text-body);
    font-weight: var(--weight-regular);
    line-height: var(--line-body);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
  }

  button,
  input,
  textarea,
  select,
  .button {
    font-size: var(--text-control);
    font-weight: var(--weight-medium);
    line-height: var(--line-compact);
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: var(--font-display);
    font-weight: var(--weight-bold);
    line-height: var(--line-title);
    text-wrap: balance;
  }

  p,
  li,
  dd,
  td,
  th,
  small,
  label,
  button {
    overflow-wrap: break-word;
  }

  /* 品牌、导航与全局页头 */
  .brand-lockup strong {
    font-size: var(--text-card-title);
    font-weight: var(--weight-bold);
  }

  .brand-lockup small,
  .document-code,
  .local-badge,
  .app-version,
  .app-version span,
  .app-version b {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .app-version b {
    font-family: var(--font-sans);
    font-weight: var(--weight-semibold);
    letter-spacing: 0.04em;
  }

  .nav-item {
    font-size: var(--text-body);
    font-weight: var(--weight-medium);
    line-height: var(--line-compact);
  }

  .nav-index {
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
  }

  .eyebrow,
  .topbar .eyebrow,
  .dashboard-timeline-eyebrow,
  .directory-index,
  .employee-file-number,
  .section-number {
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
    line-height: 1.35;
    letter-spacing: 0.06em;
  }

  .topbar h1 {
    font-size: var(--text-page-title);
    font-weight: var(--weight-bold);
    line-height: 1.2;
  }

  .top-actions .button,
  .top-actions .auth-session,
  .top-actions .auth-password-change,
  .top-actions .auth-logout,
  .top-actions .month-control input {
    font-size: var(--text-small);
  }

  .top-actions .month-control span,
  .month-control span,
  .field > span,
  .field-label {
    font-size: var(--text-small);
    font-weight: var(--weight-medium);
    line-height: var(--line-compact);
  }

  /* 页面级标题与说明 */
  .result-gallery-heading h2,
  .work-kpi-heading h2,
  .attendance-heading h2,
  .user-management-heading h2,
  .role-intro h2 {
    font-size: var(--text-section-title);
    font-weight: var(--weight-bold);
    line-height: var(--line-title);
  }

  .result-gallery-heading p,
  .work-kpi-heading p,
  .attendance-heading p,
  .user-management-heading p,
  .role-intro p,
  .panel-heading p,
  .settings-card > p,
  .modal-heading p {
    font-size: var(--text-body);
    line-height: var(--line-body);
  }

  .panel-heading h2,
  .settings-card h2,
  .directory-section-heading h3,
  .modal-heading h2 {
    font-size: var(--text-section-title);
    font-weight: var(--weight-bold);
    line-height: var(--line-title);
  }

  .result-gallery-meta span,
  .result-gallery-meta small,
  .role-formula span,
  .role-formula small {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  #result-month-label {
    font-size: var(--text-emphasis);
    font-weight: var(--weight-bold);
  }

  .result-gallery-meta {
    align-content: center;
  }

  /* 月度总览：左侧月份与进度，右侧部门 KPI 数字概览。 */
  .result-gallery-heading.is-meta-only {
    display: grid;
    grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
    align-items: stretch;
    gap: 14px;
  }

  .result-gallery-heading.is-meta-only .result-gallery-meta {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "month"
      "completion";
    min-width: 0;
    margin: 0;
    padding: 12px 16px;
    justify-self: start;
  }

  .result-month-control {
    grid-area: month;
    display: block;
    width: 100%;
  }

  .result-month-caption {
    display: block;
    margin-bottom: 1px;
    color: var(--ink-soft);
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact);
  }

  .result-month-control input {
    min-height: 38px;
    padding: 2px 4px 2px 0;
    color: var(--blue-deep);
    border: 0;
    background: transparent;
    box-shadow: none;
    font-size: 21px;
    font-weight: var(--weight-bold);
    line-height: var(--line-compact);
    cursor: pointer;
  }

  .result-month-control input:focus {
    border-color: transparent;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 0 0 3px rgba(47, 111, 228, 0.12);
  }

  .result-completion {
    grid-area: completion;
    display: flex;
    align-items: baseline;
    gap: 7px;
    min-width: 0;
  }

  #result-complete-count {
    color: var(--blue);
    font-family: var(--font-sans);
    font-size: 15px;
    font-weight: var(--weight-bold);
    line-height: var(--line-compact);
  }

  .result-completion small {
    color: var(--ink-soft);
    font-size: var(--text-meta);
    font-weight: var(--weight-medium);
  }

  .department-kpi-overview {
    display: grid;
    grid-template-columns: minmax(128px, 0.7fr) minmax(0, 3.3fr);
    align-items: center;
    gap: 14px;
    min-width: 0;
    padding: 11px 14px;
    border: 1px solid #d7e2f8;
    border-radius: 7px;
    background: linear-gradient(135deg, #f8faff 0%, #eef4ff 100%);
  }

  .department-kpi-heading {
    min-width: 0;
  }

  .department-kpi-heading span,
  .department-kpi-heading small,
  .department-kpi-item dt,
  .department-kpi-item dd span {
    color: var(--ink-soft);
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .department-kpi-heading span {
    font-weight: var(--weight-semibold);
  }

  .department-kpi-heading h2 {
    margin: 2px 0 4px;
    color: var(--ink);
    font-size: var(--text-emphasis);
    font-weight: var(--weight-bold);
    line-height: var(--line-title);
  }

  .department-kpi-heading small {
    font-weight: var(--weight-medium);
    white-space: nowrap;
  }

  .department-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 7px;
    min-width: 0;
    margin: 0;
  }

  .department-kpi-item {
    min-width: 0;
    padding: 8px 9px;
    border: 1px solid #dfe6f5;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.92);
  }

  .department-kpi-item dt,
  .department-kpi-item dd {
    margin: 0;
  }

  .department-kpi-item dt {
    margin-bottom: 3px;
    font-weight: var(--weight-semibold);
    white-space: nowrap;
  }

  .department-kpi-item dd {
    display: flex;
    align-items: baseline;
    gap: 3px;
  }

  .department-kpi-item dd strong {
    color: var(--blue-deep);
    font-size: var(--text-emphasis);
    font-weight: var(--weight-bold);
    font-variant-numeric: tabular-nums;
    line-height: var(--line-compact);
  }

  .department-kpi-item.is-total {
    border-color: rgba(47, 111, 228, 0.3);
    background: #e8f0ff;
  }

  .department-kpi-item.is-total dd strong {
    color: var(--blue);
  }

  /* 月度时间线 */
  .dashboard-timeline-heading h2 {
    font-size: var(--text-section-title);
    font-weight: var(--weight-bold);
    line-height: var(--line-title);
  }

  .dashboard-timeline-deadline span {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .dashboard-timeline-deadline strong {
    font-size: var(--text-emphasis);
    font-weight: var(--weight-bold);
  }

  .dashboard-timeline-track time strong {
    font-family: var(--font-sans);
    font-size: var(--text-meta);
    font-weight: var(--weight-bold);
  }

  .dashboard-timeline-track time span {
    font-size: 10px;
  }

  .dashboard-timeline-track b {
    font-size: var(--text-small);
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact);
  }

  .dashboard-timeline-track p,
  .dashboard-timeline-note {
    font-size: var(--text-meta);
    line-height: 1.55;
  }

  /* 员工绩效身份卡 */
  .id-card-topline,
  .id-card-topline span,
  .id-card-topline b,
  .id-card-footer,
  .id-person-copy > small,
  .id-result-stack > div > span:first-child,
  .id-final-result small {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .id-card-topline,
  .id-result-stack > div > span:first-child {
    font-weight: var(--weight-semibold);
  }

  .id-person-copy h3 {
    font-size: var(--text-card-title);
    font-weight: var(--weight-bold);
    line-height: var(--line-title);
  }

  .id-person-copy p {
    font-size: var(--text-small);
    line-height: var(--line-compact);
  }

  .level-badge,
  .final-grade-badge,
  .level-badge b,
  .final-grade-badge b,
  .id-final-result .final-grade-badge b {
    font-size: var(--text-small);
    font-weight: var(--weight-semibold);
  }

  .id-result-stack .level-badge,
  .id-result-stack .final-grade-badge,
  .id-result-stack .level-badge b,
  .id-result-stack .final-grade-badge b,
  .id-result-stack .id-final-result > span:first-child,
  .id-final-result .final-grade-badge b {
    font-size: var(--text-small);
  }

  .level-emblem-code,
  .level-badge-code,
  .final-grade-code {
    font-size: var(--text-meta);
    font-weight: var(--weight-bold);
  }

  .id-kpi-head span,
  .id-attendance-heading span,
  .id-attendance-heading strong {
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact);
  }

  .id-kpi-head b {
    font-size: var(--text-body);
    font-weight: var(--weight-bold);
  }

  .id-kpi-business-item dt,
  .id-attendance-summary dt {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .id-kpi-business-item dd,
  .id-attendance-summary dd,
  .id-attendance-summary > p {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .id-kpi-business-item dd,
  .id-attendance-summary dd {
    font-weight: var(--weight-semibold);
  }

  .id-kpi-view-button {
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact);
  }

  /* 人员档案 */
  .directory-section-heading p,
  .management-copy small,
  .intern-person-copy small,
  .employee-card-copy small,
  .employee-card-role,
  .employee-card-role span {
    font-size: var(--text-small);
    line-height: var(--line-compact);
  }

  .management-copy strong,
  .intern-person-copy strong,
  .employee-card-copy strong {
    font-size: var(--text-card-title);
    font-weight: var(--weight-bold);
    line-height: var(--line-title);
  }

  .management-role-tag,
  .intern-role-tag,
  .management-edit-button,
  .intern-promote-button,
  .intern-card-topline,
  .intern-card-topline b {
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact);
  }

  .management-capabilities dt,
  .employee-capability-grid dt,
  .intern-capabilities dt,
  .intern-dates dt,
  .employee-private-card dt,
  .employee-private-card-heading span {
    font-size: var(--text-meta);
    font-weight: var(--weight-medium);
    line-height: var(--line-compact);
  }

  .management-capabilities dd,
  .employee-capability-grid dd,
  .intern-capabilities dd,
  .intern-dates dd,
  .employee-private-card dd {
    font-size: var(--text-body);
    font-weight: var(--weight-medium);
    line-height: var(--line-compact);
  }

  .employee-private-heading h3,
  .employee-private-card-heading strong {
    font-size: var(--text-card-title);
    font-weight: var(--weight-bold);
  }

  .employee-private-heading p,
  .employee-private-inputs .field small,
  .employee-private-security,
  .employee-private-lock {
    font-size: var(--text-small);
    line-height: var(--line-body);
  }

  /* 工作内容与 KPI */
  .work-kpi-business-stat dt,
  .work-kpi-card .eyebrow,
  .work-entry-card .eyebrow,
  .work-detail-table th,
  .work-detail-kicker,
  .work-detail-meta,
  .work-kpi-card-footer,
  .work-form-note {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .work-kpi-business-stat dd {
    font-size: var(--text-small);
    font-weight: var(--weight-bold);
  }

  .work-kpi-card h3,
  .work-entry-card h3,
  .work-detail-heading h2 {
    font-size: var(--text-card-title);
    font-weight: var(--weight-bold);
    line-height: var(--line-title);
  }

  .work-kpi-summary,
  .work-kpi-card p,
  .work-entry-card p,
  .work-detail-table td {
    font-size: var(--text-small);
    line-height: var(--line-body);
  }

  /* 实习员工卡：与正式员工卡保持相同的最低可读字号 */
  .dashboard-intern-eyebrow,
  .dashboard-intern-topline,
  .dashboard-intern-topline b,
  .dashboard-intern-role-tag,
  .dashboard-intern-person p,
  .dashboard-intern-notice strong,
  .dashboard-intern-dates dt,
  .dashboard-intern-capabilities dt,
  .dashboard-intern-dates dd,
  .dashboard-intern-capabilities dd {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .dashboard-intern-heading p {
    font-size: var(--text-small);
    line-height: var(--line-body);
  }

  .dashboard-intern-heading > strong {
    font-size: var(--text-small);
  }

  .dashboard-intern-person h3 {
    font-size: var(--text-card-title);
  }

  /* 考勤页与评分参考 */
  .attendance-guidance strong,
  .attendance-intern-heading strong,
  .assessment-attendance-reference strong {
    font-size: var(--text-body);
    font-weight: var(--weight-semibold);
  }

  .attendance-guidance span,
  .attendance-guidance p,
  .assessment-attendance-reference span,
  .assessment-attendance-reference p,
  .attendance-actions span {
    font-size: var(--text-small);
    line-height: var(--line-body);
  }

  .attendance-table {
    font-size: var(--text-small);
  }

  .attendance-table th {
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact);
  }

  .attendance-table td,
  .attendance-table input {
    font-size: var(--text-small);
    line-height: var(--line-compact);
  }

  .attendance-subject-kind,
  .attendance-row-state,
  .attendance-reference-chip strong,
  .attendance-reference-chip small,
  .attendance-intern-heading span,
  .attendance-intern-heading small,
  .attendance-table td:not(:first-child)::before {
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact);
  }

  /* 登录、改密与用户管理 */
  .auth-brand span,
  .auth-gate .auth-heading .eyebrow,
  .auth-footer,
  .auth-admin-entry,
  .password-account-card span,
  .password-rule,
  .user-management-summary span,
  .user-identity span,
  .user-last-login,
  .user-status,
  .user-password-status,
  .user-actions button,
  .user-security-note,
  .user-editor-card .field small,
  .user-temporary-password span,
  .user-temporary-password small {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .auth-brand strong,
  .password-account-card strong,
  .user-management-summary strong,
  .user-identity strong,
  .user-temporary-password strong {
    font-size: var(--text-body);
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact);
  }

  .auth-gate .auth-heading h2,
  .user-management-heading h2 {
    font-size: var(--text-page-title);
    font-weight: var(--weight-bold);
    line-height: var(--line-title);
  }

  .auth-gate .auth-heading p,
  .auth-gate .auth-mode-note,
  .auth-gate .auth-security-note,
  .user-management-heading p,
  .user-table,
  .user-table td {
    font-size: var(--text-small);
    line-height: var(--line-body);
  }

  .user-table th {
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
  }

  /* 制度文档：保留编辑感，但提高正文可读性。 */
  .policy-dialog-heading h2 {
    font-size: var(--text-display);
  }

  .policy-dialog-heading p,
  .policy-summary p,
  .policy-application-grid p,
  .policy-salary-details p,
  .policy-weight-note,
  .policy-system-note p,
  .policy-dialog-footer p {
    font-size: var(--text-small);
    line-height: 1.75;
  }

  .policy-section-label,
  .policy-dialog-code,
  .policy-fact-grid span,
  .policy-cycle-strip span,
  .policy-cycle-strip small,
  .policy-timeline span,
  .policy-grade-table th,
  .policy-grade-table td {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .policy-grade-table td {
    font-size: var(--text-small);
  }

  /* 工资与受限信息只在授权界面显示，仍采用统一层级。 */
  .salary-pay-label,
  .salary-pay-note,
  .salary-pay-meta,
  .salary-pay-breakdown span {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .salary-pay-total,
  .salary-pay-breakdown strong {
    font-size: var(--text-emphasis);
    font-weight: var(--weight-bold);
  }

  /* 状态反馈与表格通用规则 */
  .data-table,
  .role-table {
    font-size: var(--text-small);
  }

  .data-table th,
  .role-table th {
    font-size: var(--text-meta);
    font-weight: var(--weight-semibold);
  }

  .data-table td,
  .role-table td,
  .person-cell strong {
    font-size: var(--text-small);
    line-height: var(--line-compact);
  }

  .person-cell small,
  .status-pill,
  .text-button,
  .queue-count {
    font-size: var(--text-meta);
    line-height: var(--line-compact);
  }

  .toast {
    font-size: var(--text-body);
    line-height: var(--line-body);
  }

  @media (max-width: 820px) {
    :root {
      --text-page-title: 28px;
      --text-section-title: 22px;
      --text-card-title: 19px;
    }

    body,
    button,
    input,
    textarea,
    select,
    .button {
      font-size: var(--text-body);
    }

    .nav-item {
      font-size: var(--text-small);
    }

    .dashboard-timeline-heading h2 {
      font-size: var(--text-section-title);
    }

    .result-gallery-heading.is-meta-only {
      grid-template-columns: minmax(0, 1fr);
    }

    .result-gallery-heading.is-meta-only .result-gallery-meta {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      grid-template-areas:
        "month"
        "completion";
      align-items: center;
      justify-items: start;
      gap: 6px 10px;
      width: 100%;
    }

    .result-month-control {
      grid-column: auto;
    }

    .result-month-control input {
      width: 100%;
    }

    #result-complete-count {
      grid-column: auto;
      grid-row: auto;
    }

    .department-kpi-overview {
      grid-template-columns: minmax(0, 1fr);
    }

    .department-kpi-heading {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 12px;
    }

    .department-kpi-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }

  @media (max-width: 430px) {
    .topbar h1,
    .auth-gate .auth-heading h2 {
      font-size: 26px;
    }

    .dashboard-timeline-track li > div {
      grid-template-columns: 76px minmax(0, 1fr);
    }

    .department-kpi-heading {
      display: block;
    }

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

html {
  min-width: 0;
}

@media print {
  body {
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
    font-size: 11pt;
    line-height: 1.55;
  }
}