/*
 * v1.5.13 · WZH 企业工作台视觉治理层
 * 最后加载：统一字体层级、控件尺寸、卡片节奏与响应式可读性。
 */

@media screen {
  :root {
    --ui-primary: #2f6fe4;
    --ui-primary-deep: #2058c1;
    --ui-text: #14213d;
    --ui-muted: #66738e;
    --ui-border: #d9e2f2;
    --ui-border-strong: #c6d4eb;
    --ui-surface: #ffffff;
    --ui-surface-soft: #f5f8ff;
    --ui-focus: rgba(47, 111, 228, 0.24);
    --ui-shadow: 0 8px 24px rgba(38, 58, 108, 0.08);
    --ui-radius-panel: 9px;
    --ui-radius-control: 6px;
    --ui-gap: 14px;
  }

  body {
    color: var(--ui-text);
  }

  .main-stage,
  .view,
  .view > *,
  .topbar,
  .global-month-context,
  dialog,
  form {
    min-width: 0;
  }

  :where(button, input, select, textarea, .button):focus-visible {
    outline: 3px solid var(--ui-focus);
    outline-offset: 2px;
  }

  :where(input, select, textarea) {
    min-height: 40px;
    border-color: var(--ui-border-strong);
    border-radius: var(--ui-radius-control);
  }

  :where(.button, .top-actions button, .modal-actions button, .attendance-actions button) {
    min-height: 38px;
    border-radius: var(--ui-radius-control);
    font-size: var(--text-small);
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact);
  }

  :where(.topbar, .global-month-context, .result-gallery-heading, .work-kpi-heading,
    .attendance-heading, .user-management-heading, .panel, .settings-card,
    .directory-section, .work-entry-card, .work-kpi-card) {
    border-color: var(--ui-border);
    border-radius: var(--ui-radius-panel);
    box-shadow: var(--ui-shadow);
  }

  .topbar {
    gap: 14px 18px;
    padding: 14px 18px;
  }

  .topbar .view-identity {
    min-width: 220px;
  }

  .topbar .eyebrow {
    margin-bottom: 4px;
    color: var(--ui-primary-deep);
    font-size: var(--text-meta);
    line-height: 1.35;
  }

  .topbar h1 {
    margin: 0;
    font-size: var(--text-page-title);
    line-height: 1.2;
    letter-spacing: -0.02em;
  }

  .top-actions {
    gap: 8px;
  }

  .nav-item {
    min-height: 44px;
    padding-block: 10px;
    font-size: var(--text-body);
  }

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

  .result-gallery-heading,
  .work-kpi-heading,
  .attendance-heading,
  .user-management-heading,
  .role-intro {
    gap: var(--ui-gap);
    padding: 16px 18px;
  }

  .result-gallery-heading h2,
  .work-kpi-heading h2,
  .attendance-heading h2,
  .user-management-heading h2,
  .role-intro h2,
  .panel-heading h2,
  .settings-card h2,
  .directory-section-heading h3,
  .modal-heading h2 {
    font-size: var(--text-section-title) !important;
    line-height: var(--line-title) !important;
  }

  .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) !important;
    line-height: var(--line-body) !important;
  }

  /* 全站月份：月份是主导航，完成度是辅助状态。 */
  .global-month-context {
    gap: 10px;
    padding: 14px;
  }

  .global-month-context .result-month-caption,
  .global-month-context .result-completion small,
  .global-month-scope,
  .global-month-scope p,
  .global-month-scope-mark {
    font-size: var(--text-meta) !important;
    line-height: var(--line-compact) !important;
  }

  #month-year-label {
    font-size: var(--text-emphasis);
    line-height: var(--line-title);
  }

  .result-month-button {
    min-height: 44px;
    font-size: var(--text-small);
  }

  .result-month-button span {
    font-size: var(--text-emphasis);
  }

  .global-month-context #result-complete-count {
    font-size: 21px;
  }

  /* 月度时间线：同一节点只保留两级文字。 */
  .dashboard-timeline {
    border-radius: var(--ui-radius-panel);
  }

  .dashboard-timeline-eyebrow,
  .dashboard-timeline-deadline span,
  .dashboard-timeline-track time strong,
  .dashboard-timeline-track time span,
  .dashboard-timeline-track p,
  .dashboard-timeline-note {
    font-size: var(--text-meta) !important;
    line-height: 1.5 !important;
  }

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

  /* 员工月度卡：修正后加载模块重新写入的 7—11 px 微小字号。 */
  .performance-id-card {
    grid-template-rows: auto auto auto auto auto auto !important;
    row-gap: 0 !important;
    border-color: var(--ui-border) !important;
    box-shadow: var(--ui-shadow) !important;
  }

  .id-card-topline,
  .id-card-topline b {
    font-size: var(--text-meta) !important;
    line-height: var(--line-compact) !important;
  }

  .performance-id-card .id-person-copy,
  .performance-id-card:has(.id-attendance-summary) .id-person-copy {
    min-height: 92px;
    height: auto;
  }

  .id-person-copy h3 {
    font-size: 22px !important;
    line-height: 1.2 !important;
  }

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

  .id-final-score > span:first-child,
  .self-assessment-value > small,
  .final-score-value small {
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  .score-equation-part small {
    max-width: 62px;
    font-size: 10px !important;
    line-height: 1.25 !important;
    white-space: normal;
  }

  .score-equation-part strong {
    font-family: var(--font-sans);
    font-size: 19px;
  }

  .id-result-stack > div,
  .id-result-stack .id-self-result,
  .id-result-stack .id-primary-result,
  .id-result-stack .id-secondary-result {
    min-height: 68px;
  }

  .id-result-stack > div > span:first-child {
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  .id-result-stack .level-badge b,
  .id-result-stack .final-grade-badge b {
    font-size: 11px !important;
  }

  .id-result-stack .level-badge,
  .id-result-stack .final-grade-badge {
    gap: 4px;
    padding-inline: 4px;
  }

  .id-result-stack .level-badge-code,
  .id-result-stack .final-grade-code {
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
  }

  .id-attendance-heading span,
  .id-attendance-heading strong,
  .id-attendance-summary dt,
  .id-kpi-head span,
  .id-kpi-business-item dt {
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

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

  .id-kpi-view-button {
    min-height: 34px;
    padding: 6px 10px;
    font-size: var(--text-meta) !important;
  }

  .performance-id-card .id-card-footer,
  .performance-id-card:has(.id-attendance-summary) .id-card-footer {
    min-height: 30px;
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  /* 主管／领导、自评及登录页。 */
  .role-reviewer-copy span,
  .role-reviewer-copy small,
  .self-assessment-option small,
  .self-assessment-policy-note strong,
  .self-assessment-policy-note span,
  .auth-brand span,
  .auth-footer,
  .auth-admin-entry {
    font-size: var(--text-meta) !important;
    line-height: var(--line-compact) !important;
  }

  .role-reviewer-copy strong {
    font-size: 18px;
    line-height: var(--line-title);
  }

  .self-assessment-option {
    min-height: 140px;
  }

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

  /* 表格和录入界面：同类字段不再出现跳字号。 */
  :where(.data-table, .role-table, .attendance-table, .work-detail-table, .user-table) {
    font-size: var(--text-small);
    line-height: var(--line-compact);
  }

  :where(.data-table, .role-table, .attendance-table, .work-detail-table, .user-table) th {
    font-size: var(--text-meta) !important;
    font-weight: var(--weight-semibold);
    line-height: var(--line-compact) !important;
  }

  :where(.data-table, .role-table, .attendance-table, .work-detail-table, .user-table) td,
  :where(.data-table, .role-table, .attendance-table, .work-detail-table, .user-table) input,
  :where(.data-table, .role-table, .attendance-table, .work-detail-table, .user-table) select {
    font-size: var(--text-small) !important;
    line-height: var(--line-compact) !important;
  }

  .field > span,
  .field-label,
  .field small,
  .form-help,
  .form-note {
    font-size: var(--text-small) !important;
    line-height: var(--line-compact) !important;
  }

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

  /* 深层业务组件：消除历史模块残留的 8—10 px 字号。 */
  .dashboard-timeline-note > span,
  .dashboard-intern-work-button,
  .management-admin-lock,
  .work-quick-period,
  .work-quick-period span,
  .work-quick-business legend,
  .work-kpi-numbers span,
  .work-kpi-duration-stat span,
  .work-kpi-duration-stat small,
  .work-kpi-card-summary span,
  .work-kpi-card-summary .is-empty,
  .work-kpi-tags .is-empty,
  .work-kpi-card-foot span,
  .work-kpi-card-foot b,
  .id-kpi-head em,
  .objective-score-badge small,
  .photo-upload-copy small,
  #intern-period-preview span,
  #intern-period-preview small,
  #employee-salary-description,
  #employee-salary-total-label,
  #employee-intern-salary-rule,
  .employee-salary-security,
  .work-kpi-summary-preview span {
    font-size: var(--text-meta) !important;
    line-height: var(--line-compact) !important;
  }

  .remove-metric {
    min-height: 30px;
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  /* 历史模板仍可由旧链接打开，保持字段完整可读，不让说明列落入隐形操作列。 */
  .template-row {
    grid-template-columns: 42px minmax(150px, 0.7fr) minmax(220px, 1.3fr) 90px;
  }

  .template-row .metric-desc {
    grid-column: 2 / 4;
  }

  .template-row .remove-metric {
    grid-column: 4;
    grid-row: 2;
  }

  #scoring-rules-dialog :where(span, small, p, b) {
    font-size: var(--text-meta) !important;
    line-height: var(--line-compact) !important;
  }

  #scoring-rules-dialog :where(.scoring-rules-grade-grid strong, .scoring-rules-steps strong) {
    font-size: var(--text-meta) !important;
  }

  #scoring-rules-dialog :where(.scoring-rules-summary strong, .scoring-rules-equation strong) {
    font-size: 18px !important;
    font-variant-numeric: tabular-nums;
  }

  #scoring-rules-dialog :where(.scoring-rules-example strong, .scoring-rules-duration-reference p span) {
    font-size: 14px !important;
    font-variant-numeric: tabular-nums;
  }

  #scoring-rules-dialog :where(.scoring-rules-chip-list b, .scoring-rules-intensity-list b) {
    font-size: 13px !important;
    font-variant-numeric: tabular-nums;
  }

  #policy-dialog :where(.policy-anchor-nav a, .policy-role-grid span,
    .policy-salary-details > span, .policy-weight-title span,
    .policy-weight-title strong, .policy-salary-lead p) {
    font-size: var(--text-meta) !important;
    line-height: var(--line-compact) !important;
  }

  #policy-dialog .policy-salary-details article > span {
    font-size: var(--text-meta) !important;
    line-height: var(--line-compact) !important;
  }

  @media (max-width: 820px) {
    .topbar {
      align-items: flex-start;
      padding: 14px;
    }

    .top-actions {
      width: 100%;
    }

    .top-actions > :where(.button, .auth-session) {
      min-height: 44px;
    }

    .result-gallery-heading,
    .work-kpi-heading,
    .attendance-heading,
    .user-management-heading,
    .role-intro {
      padding: 14px;
    }

    .result-month-button {
      min-height: 44px;
    }

    :where(.button, .text-button, .icon-button, .management-edit-button,
      .id-kpi-view-button, .dashboard-intern-work-button,
      .work-kpi-edit-button, .shadow-rule-explain-button) {
      min-height: 44px !important;
    }

    :where(.text-button, .icon-button, .management-edit-button) {
      min-width: 44px !important;
    }

    :where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) {
      min-height: 44px !important;
    }

    .management-order span,
    .dashboard-intern-title,
    .role-intro .role-formula strong {
      line-height: 1.15 !important;
    }

    .template-row {
      grid-template-columns: 34px minmax(0, 1fr);
    }

    .template-row .metric-order { grid-column: 1; grid-row: 1; }
    .template-row .metric-category { grid-column: 2; grid-row: 1; }
    .template-row .metric-name { grid-column: 2; grid-row: 2; }
    .template-row .weight-input { grid-column: 2; grid-row: 3; }
    .template-row .metric-desc { grid-column: 2; grid-row: 4; }
    .template-row .remove-metric { grid-column: 1; grid-row: 4; }

    .dashboard-timeline-track::before {
      left: 19px;
    }

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

    .dashboard-timeline-track time {
      width: 40px;
      min-width: 40px;
      height: 34px;
      padding-inline: 5px;
      white-space: nowrap;
    }

    .dashboard-timeline-track li:nth-child(4) time {
      width: 64px;
      min-width: 64px;
      margin-left: -5px;
      padding-inline: 4px;
    }

    .performance-id-card .id-person-copy,
    .performance-id-card:has(.id-attendance-summary) .id-person-copy {
      grid-template-columns: minmax(0, 1fr) minmax(142px, 0.72fr);
    }
  }

  @media (max-width: 620px) {
    .performance-id-card {
      grid-template-rows: auto auto auto auto auto auto !important;
    }

    .performance-id-card .id-person-copy,
    .performance-id-card:has(.id-attendance-summary) .id-person-copy {
      grid-template-columns: minmax(0, 1fr) 148px;
      min-height: 88px;
    }

    .id-person-copy h3 {
      font-size: 20px !important;
    }

    .id-person-copy p {
      font-size: 11px !important;
    }

    .score-equation-part small {
      max-width: 44px;
      font-size: 9px !important;
    }

    .id-result-stack > div,
    .id-result-stack .id-self-result,
    .id-result-stack .id-primary-result,
    .id-result-stack .id-secondary-result {
      min-height: 62px;
    }

    .id-attendance-summary dl > div {
      min-height: 38px;
    }
  }

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

    .performance-id-card .id-person-copy,
    .performance-id-card:has(.id-attendance-summary) .id-person-copy {
      grid-template-columns: minmax(0, 1fr);
      gap: 8px;
      padding-block: 8px !important;
    }

    .id-final-score {
      width: 100%;
    }

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

    .id-kpi-business-item:last-child:nth-child(odd) {
      grid-column: 1 / -1;
    }

    .modal-actions {
      gap: 8px;
    }

    .modal-actions .button {
      min-height: 44px;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
