/* common.css — 穿透式安全管控系统 多页面原型共享样式（由 meiyecode_backup.html 拆分生成） */
    * { margin: 0; padding: 0; box-sizing: border-box; }

    html, body {
      height: 100%;
      font-family: 'Microsoft YaHei', 'PingFang SC', 'Helvetica Neue', Arial, sans-serif;
      font-size: 12px;
      color: #333;
      background: #f0f2f5;
    }

    .app {
      display: flex;
      flex-direction: column;
      height: 100vh;
      overflow: hidden;
    }

    /* ========== 顶部导航 ========== */
    .top-nav {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      height: 40px;
      padding: 0 8px 0 12px;
      background: linear-gradient(135deg, #60a5fa 0%, #3b82f6 55%, #448aff 100%);
      color: #fff;
      flex-shrink: 0;
    }

    .top-nav-left {
      display: flex;
      align-items: flex-end;
      flex: 1;
      min-width: 0;
      height: 100%;
      gap: 12px;
    }

    .logo {
      display: flex;
      align-items: center;
      align-self: center;
      gap: 8px;
      flex-shrink: 0;
      height: 40px;
    }

    .logo-icon {
      height: 22px;
      width: auto;
      display: block;
      flex-shrink: 0;
    }

    .logo-text {
      font-size: 14px;
      font-weight: 600;
      white-space: nowrap;
      letter-spacing: 0.5px;
    }

    .nav-tabs {
      display: flex;
      align-items: flex-end;
      gap: 0;
      flex: 1;
      min-width: 0;
      height: 100%;
      padding: 0 0 0 4px;
      overflow-x: auto;
      overflow-y: visible;
    }

    .nav-tab {
      position: relative;
      width: auto;
      min-width: 108px;
      height: 30px;
      margin-left: -20px;
      margin-bottom: 0;
      flex-shrink: 0;
      cursor: pointer;
      background: none;
      border: none;
      filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.08));
    }

    .nav-tab:first-child { margin-left: 0; }

    .nav-tab-bg {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      display: block;
      pointer-events: none;
    }

    .nav-tab-bg-path {
      fill: rgba(255, 255, 255, 0.22);
      transition: fill 0.2s;
    }

    .nav-tab:hover:not(.nav-tab--active) .nav-tab-bg-path {
      fill: rgba(255, 255, 255, 0.34);
    }

    .nav-tab--active {
      height: 30px;
      filter: drop-shadow(0 -1px 4px rgba(0, 0, 0, 0.08));
    }

    .nav-tab--active .nav-tab-bg-path { fill: #fff; }

    .nav-tab-inner {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      height: 100%;
      padding: 0 14px 0 16px;
      font-size: 12px;
      color: rgba(255, 255, 255, 0.95);
      white-space: nowrap;
    }

    .nav-tab-inner--overlap { padding-left: 24px; }

    .nav-tab--active .nav-tab-inner {
      color: #3b82f6;
      font-weight: 500;
    }

    .nav-tab-close {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 12px;
      height: 12px;
      color: #94a3b8;
      flex-shrink: 0;
      cursor: pointer;
    }

    .nav-tab-close svg {
      width: 10px;
      height: 10px;
      fill: currentColor;
    }

    .top-nav-right {
      display: flex;
      align-items: center;
      align-self: center;
      gap: 12px;
      flex-shrink: 0;
      height: 40px;
    }

    .nav-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 16px;
      height: 16px;
      cursor: pointer;
      opacity: 0.9;
      color: #fff;
    }

    .nav-icon svg, .icon-svg {
      width: 1em;
      height: 1em;
      display: block;
      fill: currentColor;
    }

    .user-info {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      cursor: pointer;
    }

    .user-avatar {
      width: 24px;
      height: 24px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.25);
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
    }

    .user-avatar svg {
      width: 14px;
      height: 14px;
      fill: currentColor;
    }

    /* ========== 工具栏 ========== */
    .toolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 36px;
      padding: 0 12px;
      background: #fff;
      border-bottom: 1px solid #e8e8e8;
      flex-shrink: 0;
    }

    .toolbar-left {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }

    .toolbar-btn {
      height: 28px;
      padding: 0 14px;
      font-size: 12px;
      color: #333;
      background: #fff;
      border: none;
      border-radius: 4px;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
      transition: box-shadow 0.2s, color 0.2s, background 0.2s;
      font-family: inherit;
    }

    .toolbar-btn:hover {
      box-shadow: 0 3px 8px rgba(0, 0, 0, 0.14);
    }

    .toolbar-btn:disabled {
      color: rgba(0, 0, 0, 0.25);
      background: #f5f5f5;
      box-shadow: none;
      cursor: not-allowed;
    }

    .toolbar-btn--primary {
      color: #fff;
      background: #3b82f6;
      font-weight: 500;
    }

    .toolbar-btn--primary:hover {
      background: #2563eb;
      box-shadow: 0 3px 8px rgba(59, 130, 246, 0.35);
    }

    .toolbar-btn--primary:disabled {
      background: #a0c4ff;
      color: #fff;
    }

    .toolbar-right {
      display: flex;
      align-items: center;
      gap: 8px;
      color: #666;
      font-size: 12px;
    }

    /* ========== 模块菜单栏（统一列表页页头） ========== */
    .toolbar.module-menu-bar {
      position: relative;
      z-index: 5;
      min-height: 82px;
      height: 82px;
      padding: 0 18px 0 14px;
      gap: 0;
      overflow-x: auto;
      overflow-y: hidden;
      background: #fff;
      border-bottom: 1px solid #edf0f5;
      box-shadow: 0 5px 14px rgba(28, 42, 66, 0.08);
    }

    .module-menu-identity {
      display: flex;
      align-items: center;
      min-width: 228px;
      padding-right: 24px;
      flex: 0 0 auto;
    }

    .module-menu-icon {
      width: 52px;
      height: 52px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 52px;
      margin-right: 16px;
      color: #2f3b4d;
      background: #f3f6fc;
      border-radius: 50%;
    }

    .module-menu-icon svg {
      width: 25px;
      height: 25px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .module-menu-title {
      max-width: 220px;
      overflow: hidden;
      color: #303642;
      font-size: 17px;
      font-weight: 600;
      line-height: 1.4;
      letter-spacing: 0.02em;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .module-menu-stats {
      position: relative;
      display: flex;
      align-items: center;
      align-self: stretch;
      gap: 34px;
      min-width: 230px;
      padding: 0 28px 0 36px;
      margin-right: auto;
      flex: 0 0 auto;
    }

    .module-menu-stats::before {
      position: absolute;
      top: 15px;
      bottom: 15px;
      left: 0;
      width: 1px;
      background: #edf0f5;
      content: '';
    }

    .module-menu-stat {
      position: relative;
      min-width: 76px;
      padding-left: 17px;
      color: #9aa3b4;
      line-height: 1;
      white-space: nowrap;
    }

    .module-menu-stat::before {
      position: absolute;
      top: 4px;
      left: 0;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #3b82f6;
      box-shadow: 0 0 9px rgba(59, 130, 246, 0.72);
      content: '';
    }

    .module-menu-stat--secondary::before {
      background: #36d7a0;
      box-shadow: 0 0 9px rgba(54, 215, 160, 0.72);
    }

    .module-menu-stat-label {
      display: block;
      max-width: 108px;
      overflow: hidden;
      font-size: 12px;
      line-height: 18px;
      text-overflow: ellipsis;
    }

    .module-menu-stat-value {
      display: block;
      margin-top: 3px;
      color: #303642;
      font-size: 19px;
      font-weight: 500;
      line-height: 22px;
      font-variant-numeric: tabular-nums;
    }

    .module-menu-bar > .toolbar-left {
      display: flex;
      align-items: center;
      flex: 0 0 auto;
      flex-wrap: nowrap;
      gap: 9px;
      margin-left: 12px;
      order: 4;
    }

    .module-menu-bar > .toolbar-right {
      flex: 0 0 auto;
      margin-left: 12px;
      order: 3;
    }

    .module-menu-bar > .toolbar-left .toolbar-btn {
      height: 34px;
      padding: 0 15px;
      border: 1px solid #e1e5ec;
      box-shadow: none;
    }

    .module-menu-bar > .toolbar-left .toolbar-btn:hover {
      color: #2563eb;
      border-color: #9dbdfb;
      box-shadow: 0 3px 8px rgba(39, 73, 132, 0.09);
    }

    .module-menu-bar > .toolbar-left .toolbar-btn--primary {
      min-width: 62px;
      color: #fff;
      background: #3b82f6;
      border-color: #3b82f6;
      box-shadow: 0 3px 9px rgba(59, 130, 246, 0.28);
      order: 10;
    }

    .module-menu-bar > .toolbar-left .toolbar-btn--primary:hover {
      color: #fff;
      background: #2563eb;
      border-color: #2563eb;
      box-shadow: 0 4px 11px rgba(59, 130, 246, 0.34);
    }

    .module-menu-bar-ready .view > .list-header:first-child,
    .module-menu-bar-ready .view > .report-stats:first-child {
      display: none;
    }

    @media (max-width: 980px) {
      .toolbar.module-menu-bar { padding-right: 12px; }
      .module-menu-identity { min-width: 200px; padding-right: 18px; }
      .module-menu-title { max-width: 165px; font-size: 15px; }
      .module-menu-stats { gap: 20px; min-width: 208px; padding: 0 18px 0 26px; }
      .module-menu-bar > .toolbar-left { gap: 6px; }
      .module-menu-bar > .toolbar-left .toolbar-btn { padding: 0 11px; }
    }

    @media (max-width: 720px) {
      .toolbar.module-menu-bar { min-height: 72px; height: 72px; }
      .module-menu-identity { min-width: 176px; padding-right: 14px; }
      .module-menu-icon { width: 44px; height: 44px; flex-basis: 44px; margin-right: 11px; }
      .module-menu-icon svg { width: 22px; height: 22px; }
      .module-menu-title { max-width: 120px; font-size: 14px; }
      .module-menu-stats { gap: 14px; min-width: 188px; padding: 0 14px 0 22px; }
      .module-menu-stat { min-width: 70px; }
      .module-menu-stat-value { font-size: 17px; }
    }

    .pager-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 16px;
      height: 16px;
      cursor: pointer;
      color: #999;
      user-select: none;
    }

    .pager-icon svg { width: 12px; height: 12px; fill: currentColor; }
    .pager-icon:hover { color: #1890ff; }

    .pager-text { margin: 0 4px; color: #333; }

    /* ========== 主内容 ========== */
    .main-content {
      flex: 1;
      overflow: auto;
      padding: 8px 12px 12px;
      background: #f0f2f5;
    }

    .view { display: none; }
    .view.view--active { display: block; }

    /* ========== 面板 ========== */
    .panel {
      position: relative;
      background: #fff;
      border: 1px solid #e8e8e8;
      margin-bottom: 8px;
    }

    .panel-header {
      display: flex;
      align-items: stretch;
      justify-content: flex-start;
      height: 36px;
      padding: 0 12px;
      border-bottom: 1px solid #f0f0f0;
      background: #fafafa;
    }

    .panel--with-status .panel-header {
      padding: 0 0 0 12px;
    }

    .panel-title-wrap {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .panel-accent {
      width: 3px;
      height: 14px;
      background: #1890ff;
      border-radius: 1px;
    }

    .panel-title {
      font-size: 13px;
      font-weight: 600;
      color: #333;
      margin: 0;
    }

    .panel-header-status-group {
      margin-left: auto;
      display: flex;
      align-items: center;
      gap: 8px;
      flex-shrink: 0;
    }

    .status-bookmark {
      align-self: center;
      display: inline-flex;
      align-items: center;
      height: 24px;
      padding: 0 12px 0 14px;
      font-size: 11px;
      font-weight: 500;
      line-height: 1;
      color: #595959;
      background: #f5f5f5;
      border: 1px solid #d9d9d9;
      border-radius: 12px;
      white-space: nowrap;
      flex-shrink: 0;
    }

    .status-bookmark--新建, .status-bookmark--编辑 {
      color: #595959; background: #f5f5f5; border-color: #d9d9d9;
    }
    .status-bookmark--审批中, .status-bookmark--业务部门审核中, .status-bookmark--科智部评审中, .status-bookmark--乙方评估中 {
      color: #1890ff; background: #e6f7ff; border-color: #91d5ff;
    }
    .status-bookmark--审批通过, .status-bookmark--完成 {
      color: #52c41a; background: #f6ffed; border-color: #b7eb8f;
    }
    .status-bookmark--审批不通过 {
      color: #cf1322; background: #fff1f0; border-color: #ffa39e;
    }

    /* ========== 表单网格 ========== */
    .form-grid {
      padding: 8px 12px 12px;
    }

    .form-row {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
    }

    .form-row--span-4 .form-cell--span-4 {
      grid-column: 1 / -1;
      display: flex;
      flex-direction: column;
      height: 80px;
      min-height: 80px;
      max-height: 80px;
      box-sizing: border-box;
    }

    .form-row--span-4 .form-value {
      flex: 1;
      min-height: 0;
      padding: 3px 8px 6px;
      display: flex;
      align-items: flex-start;
    }

    .form-row:not(.form-row--span-4) .form-cell {
      display: flex;
      flex-direction: column;
      height: 56px;
      min-height: 56px;
      max-height: 56px;
      box-sizing: border-box;
      overflow: hidden;
    }

    .form-cell {
      display: flex;
      flex-direction: column;
    }

    .form-label {
      flex-shrink: 0;
      height: 24px;
      box-sizing: border-box;
      font-size: 12px;
      font-weight: bold;
      color: #333;
      padding: 0 8px;
      line-height: 24px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .required-mark {
      color: #ff4d4f !important;
      margin-right: 2px;
    }

    .form-row:not(.form-row--span-4) .form-value {
      flex: none;
      height: 32px;
      min-height: 32px;
      max-height: 32px;
      box-sizing: border-box;
      font-size: 12px;
      color: #333;
      padding: 3px 8px;
      line-height: 26px;
      display: flex;
      align-items: center;
      gap: 4px;
      min-width: 0;
      overflow: hidden;
    }

    .form-field-content, .form-control-wrap {
      display: block;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .form-control-wrap {
      display: inline-flex;
      align-items: center;
      height: 26px;
      max-height: 26px;
      flex-shrink: 0;
    }

    .form-field-content { cursor: default; height: 26px; line-height: 26px; }
    .form-field-content--disabled { color: #999; }

    .form-control-wrap--select, .form-control-wrap--input {
      width: 100%;
      background: #fff;
      border: 1px solid #d9d9d9;
      border-radius: 2px;
      box-sizing: border-box;
      position: relative;
    }

    .form-control-wrap--select:hover, .form-control-wrap--input:hover { border-color: #bfbfbf; }
    .form-control-wrap--select:focus-within, .form-control-wrap--input:focus-within {
      border-color: #91caff;
      box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.1);
    }

    .form-control-select, .form-control-input {
      width: 100%;
      height: 26px;
      padding: 0 22px 0 8px;
      font-size: 12px;
      color: #333;
      background: transparent;
      border: none;
      outline: none;
      font-family: inherit;
      appearance: none;
      -webkit-appearance: none;
      cursor: pointer;
    }

    .form-control-input { cursor: text; padding-right: 8px; }
    .form-control-input--date { padding-right: 8px; }

    .form-control-wrap--select::after {
      content: '';
      position: absolute;
      right: 8px;
      top: 50%;
      width: 0;
      height: 0;
      border-left: 4px solid transparent;
      border-right: 4px solid transparent;
      border-top: 5px solid #999;
      transform: translateY(-40%);
      pointer-events: none;
    }

    .form-control-wrap--textarea {
      display: block;
      width: 100%;
      max-width: 100%;
      height: 48px;
      max-height: 48px;
      box-sizing: border-box;
      border: 1px solid #d9d9d9;
      border-radius: 2px;
      background: #fff;
      padding: 4px 8px;
      font-size: 12px;
      color: #333;
      font-family: inherit;
      resize: none;
      outline: none;
    }

    .form-control-wrap--textarea:hover { border-color: #bfbfbf; }
    .form-control-wrap--textarea:focus {
      border-color: #91caff;
      box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.1);
    }

    /* ========== 数据表（子表） ========== */
    .table-wrap {
      padding: 12px 16px 14px;
    }

    .table-scroll {
      width: 100%;
      max-width: 100%;
      overflow-x: auto;
    }

    .data-table {
      width: 100%;
      border-collapse: collapse;
      table-layout: fixed;
      font-size: 12px;
      border: 1px solid #e8e8e8;
    }

    .data-table th {
      background: #fafafa;
      color: #666;
      font-weight: 500;
      padding: 10px 12px;
      font-size: 12px;
      line-height: 1.45;
      border: 1px solid #e8e8e8;
      text-align: center;
      white-space: normal;
      word-break: break-word;
      vertical-align: middle;
    }

    .data-table td {
      padding: 8px 12px;
      font-size: 12px;
      line-height: 1.5;
      border: 1px solid #e8e8e8;
      color: #333;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      vertical-align: middle;
      max-width: 0;
    }

    .data-table td.col-check,
    .data-table td.col-index,
    .data-table td.col-ops,
    .data-table td:has(input),
    .data-table td:has(select) {
      max-width: none;
      overflow: hidden;
    }

    .data-table td.table-empty {
      text-align: center;
      color: #bfbfbf;
      padding: 24px;
    }

    .table-cell-input, .table-cell-select {
      width: 100%;
      height: 24px;
      padding: 0 6px;
      font-size: 12px;
      color: #333;
      background: #fff;
      border: 1px solid #d9d9d9;
      border-radius: 2px;
      outline: none;
      font-family: inherit;
      box-sizing: border-box;
    }

    .table-cell-input:focus, .table-cell-select:focus {
      border-color: #91caff;
      box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.1);
    }

    .table-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 8px 16px;
      border-top: 1px solid #f0f0f0;
      background: #fafafa;
      font-size: 12px;
      color: #666;
    }

    .table-footer-left { display: flex; align-items: center; gap: 8px; }
    .table-footer-right { display: flex; align-items: center; gap: 8px; }

    .table-delete-btn {
      height: 24px;
      padding: 0 10px;
      font-size: 12px;
      color: #cf1322;
      background: #fff;
      border: 1px solid #ffa39e;
      border-radius: 4px;
      cursor: pointer;
      font-family: inherit;
    }

    .table-delete-btn:hover { background: #fff1f0; }

    .table-new-btn {
      height: 24px;
      padding: 0 10px;
      font-size: 12px;
      color: #3b82f6;
      background: #fff;
      border: 1px solid #91caff;
      border-radius: 4px;
      cursor: pointer;
      font-family: inherit;
    }

    .table-new-btn:hover { background: #e6f7ff; }

    /* ========== 项目主计划 · 标段变更 ========== */
    .plan-alert {
      display: none;
      align-items: center;
      gap: 8px;
      margin-bottom: 12px;
      padding: 9px 12px;
      font-size: 12px;
      line-height: 1.6;
      color: #d46b08;
      background: #fff7e6;
      border: 1px solid #ffd591;
      border-radius: 4px;
    }
    .plan-alert--show { display: flex; }
    .plan-alert--info {
      color: #0958d9;
      background: #e6f4ff;
      border-color: #91caff;
    }
    .plan-alert-tag {
      flex-shrink: 0;
      padding: 1px 6px;
      font-size: 11px;
      color: #fff;
      background: #fa8c16;
      border-radius: 3px;
    }
    .plan-alert--info .plan-alert-tag { background: #1890ff; }
    .bid-banner {
      display: none;
      align-items: center;
      gap: 6px;
      margin-bottom: 10px;
      padding: 8px 12px;
      font-size: 12px;
      color: #d46b08;
      background: #fff7e6;
      border: 1px dashed #ffd591;
      border-radius: 4px;
    }
    .bid-banner--show { display: flex; }
    .bid-banner strong { color: #d4380d; }
    .bid-row--new > td { background: #fff7e6; }
    .bid-row--new > td:first-child { box-shadow: inset 3px 0 0 #fa8c16; }
    .bid-row--new .table-cell-input,
    .bid-row--new .table-cell-select { border-color: #ffbb96; }
    .bid-badge {
      display: inline-block;
      height: 18px;
      line-height: 18px;
      padding: 0 6px;
      margin-left: 4px;
      font-size: 11px;
      color: #d46b08;
      background: #fff2e8;
      border: 1px solid #ffbb96;
      border-radius: 3px;
      vertical-align: middle;
    }
    .bid-badge--locked {
      color: #8c8c8c;
      background: #fafafa;
      border-color: #e8e8e8;
    }
    .bid-ro-text { color: #8c8c8c; }
    .bid-attach-btn {
      height: 22px;
      padding: 0 8px;
      font-size: 12px;
      color: #3b82f6;
      background: #fff;
      border: 1px dashed #91caff;
      border-radius: 4px;
      cursor: pointer;
      font-family: inherit;
    }
    .bid-attach-btn:hover { background: #e6f7ff; }
    .bid-attach-link {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 12px;
      color: #1890ff;
      cursor: pointer;
    }
    .bid-attach-link svg { width: 12px; height: 12px; fill: currentColor; }
    /* 源单据编号：追溯样式 */
    .trace-link {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      color: #1890ff;
      cursor: pointer;
    }
    .trace-link:hover { text-decoration: underline; }
    .trace-link-icon {
      width: 13px;
      height: 13px;
      flex-shrink: 0;
      fill: currentColor;
    }
    /* 变更单据标段子表：隐藏操作列 */
    .bid-col-hidden th:last-child,
    .bid-col-hidden td:last-child { display: none; }

    /* ========== 审批流程 ========== */
    .flow-wrap {
      padding: 16px;
    }

    .flow-steps {
      display: flex;
      align-items: stretch;
      justify-content: space-between;
      gap: 0;
      position: relative;
    }

    .flow-step {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      position: relative;
      min-width: 0;
    }

    .flow-step-icon {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      font-weight: 600;
      color: #fff;
      background: #d9d9d9;
      z-index: 2;
      position: relative;
      flex-shrink: 0;
    }

    .flow-step--done .flow-step-icon { background: #52c41a; }
    .flow-step--current .flow-step-icon {
      background: #1890ff;
      box-shadow: 0 0 0 4px rgba(24, 144, 255, 0.15);
    }
    .flow-step--reject .flow-step-icon { background: #cf1322; }

    .flow-step-name {
      margin-top: 8px;
      font-size: 12px;
      font-weight: 600;
      color: #333;
      text-align: center;
    }

    .flow-step-role {
      margin-top: 2px;
      font-size: 11px;
      color: #999;
      text-align: center;
    }

    .flow-step-op {
      margin-top: 6px;
      font-size: 11px;
      color: #666;
      text-align: center;
      min-height: 16px;
    }

    .flow-step--done .flow-step-op { color: #52c41a; }
    .flow-step--current .flow-step-op { color: #1890ff; font-weight: 500; }
    .flow-step--reject .flow-step-op { color: #cf1322; }

    .flow-line {
      position: absolute;
      top: 18px;
      left: 50%;
      width: 100%;
      height: 2px;
      background: #d9d9d9;
      z-index: 1;
    }

    .flow-step:last-child .flow-line { display: none; }

    .flow-step--done .flow-line { background: #52c41a; }

    /* 详情页签（测试项/缺陷/测试报告） */
    .detail-tabs {
      display: flex;
      align-items: center;
      gap: 8px;
      border-bottom: 1px solid #e8e8e8;
      margin-bottom: 12px;
      padding: 0 2px;
      overflow-x: auto;
    }
    .detail-tab {
      position: relative;
      padding: 10px 14px 12px;
      font-size: 13px;
      font-weight: 600;
      color: #666;
      cursor: pointer;
      white-space: nowrap;
      border: none;
      background: none;
    }
    .detail-tab:hover { color: #1890ff; }
    .detail-tab--active { color: #1890ff; }
    .detail-tab--active::after {
      content: '';
      position: absolute;
      left: 14px;
      right: 14px;
      bottom: -1px;
      height: 2px;
      background: #1890ff;
      border-radius: 1px;
    }
    /* 详情页签内容区：统一内边距，各页面无需再写内联 style */
    .detail-pane { display: none; padding: 12px 16px; }
    .detail-pane--active { display: block; }

    /* 面板头部操作按钮：尺寸统一 */
    .panel-header .biz-btn { height: 24px; line-height: 22px; padding: 0 10px; font-size: 12px; }

    /* 面板内紧凑表单区（下方紧接表格时压缩底部间距）与表格区内边距 */
    .form-grid--tight { padding-bottom: 4px; }
    .table-scroll--pad { padding: 0 12px 12px; }

    /* 测试报告统计卡片 */
    .report-stats {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-bottom: 12px;
    }
    .report-stat {
      flex: 1 1 150px;
      min-width: 130px;
      border: 1px solid #eef0f3;
      border-radius: 6px;
      padding: 14px 16px;
      background: #fafbfc;
    }
    .report-stat-value { font-size: 22px; font-weight: 700; color: #1890ff; line-height: 1.2; }
    .report-stat-value--green { color: #52c41a; }
    .report-stat-value--red { color: #f5222d; }
    .report-stat-label { margin-top: 4px; font-size: 12px; color: #999; }

    .flow-detail {
      margin-top: 16px;
    }

    .flow-detail-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 12px;
      border: 1px solid #e8e8e8;
    }

    .flow-detail-table th {
      background: #fafafa;
      padding: 8px 12px;
      text-align: center;
      font-weight: 600;
      color: #666;
      border: 1px solid #e8e8e8;
    }

    .flow-detail-table td {
      padding: 8px 12px;
      border: 1px solid #e8e8e8;
      text-align: center;
      color: #333;
      vertical-align: middle;
    }

    .flow-detail-table td.opinion {
      text-align: left;
      max-width: 320px;
      white-space: normal;
      word-break: break-word;
    }

    /* ========== 列表页 ========== */
    .list-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 10px 12px;
      background: #fff;
      border: 1px solid #e8e8e8;
      margin-bottom: 8px;
    }

    .list-title {
      font-size: 13px;
      font-weight: 600;
      color: #333;
    }

    .list-stats {
      display: flex;
      align-items: center;
      gap: 16px;
      font-size: 12px;
      color: #666;
    }

    .list-stats .stat-dot {
      display: inline-block;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      margin-right: 4px;
      vertical-align: middle;
    }

    .stat-dot--today { background: #1890ff; }
    .stat-dot--3d { background: #52c41a; }
    .stat-dot--7d { background: #faad14; }

    .list-search-bar {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 0 12px 8px;
      font-size: 12px;
      color: #666;
    }

    .search-tag {
      display: inline-flex;
      align-items: center;
      height: 24px;
      padding: 0 10px;
      background: #e6f7ff;
      border: 1px solid #91d5ff;
      border-radius: 12px;
      color: #1890ff;
      cursor: pointer;
    }

    .search-tag.active {
      background: #1890ff;
      color: #fff;
    }

    .list-table-wrap {
      background: #fff;
      border: 1px solid #e8e8e8;
    }

    .list-table th {
      position: sticky;
      top: 0;
      background: #fafafa;
    }

    .list-table th .th-search {
      width: 100%;
      margin-top: 4px;
      height: 24px;
      padding: 0 6px;
      font-size: 11px;
      border: 1px solid #e8e8e8;
      border-radius: 2px;
      outline: none;
    }

    .list-table th .th-search:focus {
      border-color: #91caff;
    }

    .row-link {
      color: #1890ff;
      cursor: pointer;
      text-decoration: none;
    }

    .row-link:hover { text-decoration: underline; }

    .status-text--审批中 { color: #1890ff; }
    .status-text--审批通过 { color: #52c41a; }
    .status-text--审批不通过 { color: #cf1322; }
    .status-text--新建 { color: #595959; }

    /* ========== 附件区域 ========== */
    .attach-wrap { padding: 12px 16px 14px; }

    .attach-toolbar {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 12px;
    }

    .attach-check {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      height: 26px;
      padding: 0 10px;
      font-size: 12px;
      color: #333;
      background: #fafafa;
      border: 1px solid #e8e8e8;
      border-radius: 3px;
      cursor: pointer;
      user-select: none;
    }

    .attach-check input { cursor: pointer; margin: 0; }

    .attach-btn {
      height: 26px;
      padding: 0 12px;
      font-size: 12px;
      color: #333;
      background: #fafafa;
      border: 1px solid #e8e8e8;
      border-radius: 3px;
      cursor: pointer;
      font-family: inherit;
      transition: all 0.2s;
    }

    .attach-btn:hover {
      color: #1890ff;
      border-color: #91caff;
      background: #e6f7ff;
    }

    .attach-view-toggle {
      margin-left: auto;
      display: inline-flex;
      align-items: center;
      gap: 12px;
    }

    .attach-view-icon {
      display: inline-flex;
      color: #bfbfbf;
      cursor: pointer;
      transition: color 0.2s;
    }

    .attach-view-icon svg { width: 15px; height: 15px; fill: currentColor; }
    .attach-view-icon:hover { color: #1890ff; }
    .attach-view-icon--active { color: #1890ff; }

    .attach-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
    }

    .attach-card {
      width: 88px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
    }

    .attach-card-box {
      position: relative;
      width: 88px;
      height: 88px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 3px;
      border: 1px solid #e8e8e8;
      border-radius: 6px;
      background: #fafafa;
      transition: all 0.2s;
    }

    .attach-card-box:hover { border-color: #91caff; background: #e6f7ff; }

    .attach-card-check {
      position: absolute;
      top: 6px;
      left: 6px;
      margin: 0;
      cursor: pointer;
    }

    .attach-card-icon {
      display: inline-flex;
      color: #1890ff;
    }

    .attach-card-icon svg { width: 26px; height: 26px; fill: currentColor; }

    .attach-card-ext {
      font-size: 10px;
      font-weight: 600;
      color: #8c8c8c;
      letter-spacing: 0.5px;
    }

    .attach-card-name {
      width: 100%;
      font-size: 11px;
      color: #333;
      text-align: center;
      line-height: 1.35;
      word-break: break-all;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .attach-upload-card {
      width: 88px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
    }

    .attach-upload-box {
      width: 88px;
      height: 88px;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid #d6e4ff;
      border-radius: 6px;
      background: #f0f5ff;
      cursor: pointer;
      transition: all 0.2s;
    }

    .attach-upload-box:hover { border-color: #1890ff; background: #e0edff; }

    .attach-upload-plus {
      font-size: 30px;
      line-height: 1;
      font-weight: 300;
      color: #1890ff;
    }

    .attach-upload-label {
      font-size: 11px;
      color: #595959;
      text-align: center;
    }

    /* ========== 侧边栏与功能菜单 ========== */
    .menu-toggle {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 28px;
      height: 28px;
      margin-right: 10px;
      align-self: center;
      flex-shrink: 0;
      color: #fff;
      background: rgba(255, 255, 255, 0.16);
      border: none;
      border-radius: 4px;
      cursor: pointer;
      transition: background 0.2s;
    }

    .menu-toggle:hover { background: rgba(255, 255, 255, 0.3); }
    .menu-toggle svg { width: 16px; height: 16px; fill: currentColor; }

    .body-wrap {
      flex: 1;
      display: flex;
      overflow: hidden;
      min-height: 0;
    }

    .sidebar {
      width: 200px;
      flex-shrink: 0;
      background: #fff;
      border-right: 1px solid #e8e8e8;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      transition: width 0.2s ease, opacity 0.2s ease;
    }

    .sidebar--collapsed {
      width: 0;
      border-right: none;
      opacity: 0;
    }

    .sidebar-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 40px;
      padding: 0 12px;
      border-bottom: 1px solid #f0f0f0;
      flex-shrink: 0;
    }

    .sidebar-title {
      font-size: 13px;
      font-weight: 600;
      color: #333;
    }

    .sidebar-collapse {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 18px;
      height: 18px;
      color: #8c8c8c;
      cursor: pointer;
      white-space: nowrap;
    }

    .sidebar-collapse:hover { color: #1890ff; }
    .sidebar-collapse svg { width: 14px; height: 14px; fill: currentColor; }

    .sidebar-menu {
      flex: 1;
      overflow-y: auto;
      overflow-x: hidden;
      padding: 6px 0 12px;
    }

    .menu-group-head {
      display: flex;
      align-items: center;
      gap: 8px;
      height: 34px;
      padding: 0 12px;
      font-size: 12px;
      font-weight: 600;
      color: #333;
      cursor: pointer;
      user-select: none;
    }

    .menu-group-head:hover { background: #f5f7fa; }

    .menu-group-icon {
      display: inline-flex;
      width: 15px;
      height: 15px;
      color: #595959;
      flex-shrink: 0;
    }

    .menu-group-icon svg { width: 15px; height: 15px; fill: currentColor; }

    .menu-group-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

    .menu-arrow {
      display: inline-flex;
      width: 10px;
      height: 10px;
      color: #bfbfbf;
      flex-shrink: 0;
      transition: transform 0.2s;
    }

    .menu-arrow svg { width: 10px; height: 10px; fill: currentColor; }
    .menu-arrow--open { transform: rotate(90deg); }

    .menu-group-items { overflow: hidden; }
    .menu-group-items--closed { display: none; }

    .menu-item {
      display: flex;
      align-items: center;
      height: 32px;
      padding: 0 12px 0 35px;
      font-size: 12px;
      color: #595959;
      cursor: pointer;
      border-left: 2px solid transparent;
      user-select: none;
      white-space: nowrap;
    }

    .menu-item:hover { color: #1890ff; background: #f5f9ff; }

    .menu-item--active {
      color: #1890ff;
      font-weight: 600;
      background: #e6f7ff;
      border-left-color: #1890ff;
    }

    .body-main {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    /* ========== 审批流程弹窗 ========== */
    .rel-flow-mask {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.45);
      z-index: 1000;
      display: none;
      align-items: center;
      justify-content: center;
    }
    .rel-flow-mask--show { display: flex; }
    .rel-flow-modal {
      width: 900px;
      max-width: 94vw;
      height: 460px;
      background: #fff;
      border-radius: 6px;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    }
    .rel-flow-modal-header {
      height: 44px;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 16px;
      border-bottom: 1px solid #f0f0f0;
    }
    .rel-flow-modal-title {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 14px;
      font-weight: 600;
      color: #262626;
    }
    .rel-flow-modal-title-icon {
      width: 18px;
      height: 18px;
      border-radius: 3px;
      background: #1890ff;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
    }
    .rel-flow-modal-title-icon svg { width: 12px; height: 12px; fill: #fff; }
    .rel-flow-modal-close {
      background: none;
      border: none;
      cursor: pointer;
      font-size: 18px;
      line-height: 1;
      color: #999;
    }
    .rel-flow-modal-close:hover { color: #666; }
    .rel-flow-modal-body {
      flex: 1;
      display: flex;
      min-height: 0;
    }
    .rel-flow-canvas {
      flex: 1;
      position: relative;
      padding: 66px 32px 32px;
      background: #fff;
      overflow: auto;
    }
    .rel-flow-legend {
      position: absolute;
      top: 18px;
      right: 24px;
      display: flex;
      align-items: center;
      gap: 12px;
      font-size: 12px;
      color: #8c8c8c;
    }
    .rel-flow-legend-item { display: flex; align-items: center; gap: 4px; }
    .rel-flow-legend-dot {
      width: 8px;
      height: 8px;
      border-radius: 2px;
      display: inline-block;
    }
    .rel-flow-chain {
      display: flex;
      align-items: flex-start;
      min-width: max-content;
    }
    .rel-flow-node {
      width: 104px;
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .rel-flow-node-icon {
      width: 38px;
      height: 38px;
      border-radius: 6px;
      background: #f5f5f5;
      border: 1px solid #e8e8e8;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      font-weight: 600;
      color: #bfbfbf;
    }
    .rel-flow-node--start .rel-flow-node-icon {
      background: #52c41a;
      border-color: #52c41a;
      color: #fff;
    }
    .rel-flow-node--end .rel-flow-node-icon {
      background: #fff;
      border-color: #d9d9d9;
      color: #8c8c8c;
    }
    .rel-flow-node--done .rel-flow-node-icon {
      background: #e6f7ff;
      border-color: #91d5ff;
      color: #1890ff;
    }
    .rel-flow-node--pending .rel-flow-node-icon {
      background: #fff7e6;
      border-color: #ffd591;
      color: #fa8c16;
      box-shadow: 0 0 0 3px rgba(250, 140, 22, 0.12);
    }
    .rel-flow-node-name {
      margin-top: 10px;
      font-size: 12px;
      font-weight: 600;
      color: #333;
      text-align: center;
    }
    .rel-flow-node-role {
      margin-top: 2px;
      font-size: 11px;
      color: #999;
      text-align: center;
    }
    .rel-flow-connector {
      flex: 1;
      min-width: 34px;
      height: 38px;
      display: flex;
      align-items: center;
    }
    .rel-flow-connector::before {
      content: '';
      flex: 1;
      border-top: 1px dashed #bfbfbf;
    }
    .rel-flow-side {
      width: 200px;
      flex-shrink: 0;
      border-left: 1px solid #f0f0f0;
      display: flex;
      flex-direction: column;
    }
    .rel-flow-side-tabs {
      display: flex;
      flex-shrink: 0;
      border-bottom: 1px solid #f0f0f0;
    }
    .rel-flow-side-tab {
      flex: 1;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      color: #595959;
      cursor: pointer;
      border-bottom: 2px solid transparent;
    }
    .rel-flow-side-tab--active {
      color: #1890ff;
      font-weight: 600;
      border-bottom-color: #1890ff;
    }
    .rel-flow-side-empty {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 12px;
      color: #bfbfbf;
      font-size: 12px;
    }
    .rel-flow-side-empty svg { width: 56px; height: 56px; fill: #e8e8e8; }

    /* ========== Toast ========== */
    .toast {
      position: fixed;
      top: 60px;
      left: 50%;
      transform: translateX(-50%);
      padding: 8px 20px;
      background: rgba(0, 0, 0, 0.75);
      color: #fff;
      font-size: 12px;
      border-radius: 4px;
      z-index: 9999;
      display: none;
    }

    .toast.toast--show { display: block; }
    .toast.toast--success { background: rgba(82, 196, 26, 0.9); }
    .toast.toast--warn { background: rgba(250, 173, 20, 0.9); }
    .toast.toast--error { background: rgba(207, 19, 34, 0.9); }

    /* ========== 打印 ========== */
    .print-area { display: none; }

    @media print {
      body { background: #fff; }
      .app { display: none; }
      .print-area {
        display: block;
        padding: 24px;
        font-family: 'SimSun', '宋体', serif;
        color: #000;
      }
      .print-title {
        text-align: center;
        font-size: 22px;
        font-weight: bold;
        margin-bottom: 6px;
      }
      .print-subtitle {
        text-align: center;
        font-size: 12px;
        color: #666;
        margin-bottom: 20px;
      }
      .print-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 12px;
        margin-bottom: 16px;
      }
      .print-table th, .print-table td {
        border: 1px solid #000;
        padding: 8px 10px;
        vertical-align: middle;
      }
      .print-table th {
        background: #f0f0f0;
        text-align: center;
        font-weight: bold;
        width: 120px;
      }
      .print-table td.label-cell {
        background: #f5f5f5;
        text-align: center;
        font-weight: bold;
        width: 120px;
      }
      .print-table .span-row td {
        height: 70px;
        vertical-align: top;
        padding-top: 8px;
        line-height: 1.8;
      }
      .print-sign-row {
        margin-top: 30px;
        display: flex;
        justify-content: space-between;
        font-size: 12px;
      }
      .print-sign-row > div {
        flex: 1;
        text-align: center;
      }
      .print-sign-line {
        margin-top: 40px;
        border-top: 1px solid #000;
        display: inline-block;
        width: 160px;
      }
      .print-footer {
        margin-top: 30px;
        text-align: right;
        font-size: 11px;
        color: #999;
      }
      @page { size: A4; margin: 15mm; }
    }

    /* ========== 标段实施计划 ========== */
    .sp-head-bar {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 12px;
      font-size: 13px;
      color: #595959;
    }
    .sp-head-bar strong { color: #262626; font-size: 14px; }
    .sp-version {
      display: inline-block;
      height: 20px;
      line-height: 18px;
      padding: 0 8px;
      font-size: 11px;
      color: #0958d9;
      background: #e6f4ff;
      border: 1px solid #91caff;
      border-radius: 10px;
    }
    .sp-phase-tag {
      display: inline-block;
      height: 18px;
      line-height: 16px;
      padding: 0 6px;
      font-size: 11px;
      color: #0958d9;
      background: #e6f4ff;
      border: 1px solid #91caff;
      border-radius: 3px;
      white-space: nowrap;
    }
    .sp-accept-badge {
      display: inline-block;
      height: 18px;
      line-height: 16px;
      padding: 0 6px;
      margin-left: 5px;
      font-size: 11px;
      color: #389e0d;
      background: #f6ffed;
      border: 1px solid #b7eb8f;
      border-radius: 3px;
      vertical-align: middle;
    }
    .sp-node-lock {
      display: inline-block;
      height: 18px;
      line-height: 16px;
      padding: 0 6px;
      margin-left: 5px;
      font-size: 11px;
      color: #8c8c8c;
      background: #fafafa;
      border: 1px solid #e8e8e8;
      border-radius: 3px;
      vertical-align: middle;
    }
    .sp-ms-name { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: #262626; }
    .sp-ms-flag { width: 14px; height: 14px; fill: #f5222d; flex-shrink: 0; }
    .sp-wbs-name { display: inline-flex; align-items: center; gap: 6px; padding-left: 26px; color: #595959; font-weight: 400; }
    .sp-tree-toggle {
      display: inline-flex;
      width: 14px;
      height: 14px;
      cursor: pointer;
      fill: #8c8c8c;
      flex-shrink: 0;
      transition: transform .15s;
    }
    .sp-tree-toggle--closed { transform: rotate(-90deg); }
    .sp-row--ms > td { background: #fafafa; }
    .sp-row--ms > td:first-child { box-shadow: inset 3px 0 0 #1890ff; }
    .sp-row--wbs > td { background: #fff; }
    .sp-row--wbs-hidden { display: none; }
    .sp-risk-tag {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      margin-top: 4px;
      padding: 1px 8px;
      font-size: 11px;
      font-weight: 400;
      color: #d46b08;
      background: #fff7e6;
      border: 1px dashed #ffd591;
      border-radius: 3px;
      white-space: normal;
      line-height: 1.5;
    }
    .sp-risk-tag--done { color: #389e0d; background: #f6ffed; border-color: #b7eb8f; }
    .sp-add-wbs {
      height: 22px;
      padding: 0 8px;
      font-size: 12px;
      color: #3b82f6;
      background: #fff;
      border: 1px dashed #91caff;
      border-radius: 4px;
      cursor: pointer;
      font-family: inherit;
    }
    .sp-add-wbs:hover { background: #e6f7ff; }
    /* 面板内 tabs */
    .sp-inner-tabs { display: flex; gap: 4px; padding: 0 16px; border-bottom: 1px solid #f0f0f0; }
    .sp-inner-tab { position: relative; padding: 10px 14px; font-size: 13px; color: #595959; cursor: pointer; }
    .sp-inner-tab:hover { color: #1890ff; }
    .sp-inner-tab--active { color: #1890ff; font-weight: 600; }
    .sp-inner-tab--active::after {
      content: '';
      position: absolute;
      left: 14px;
      right: 14px;
      bottom: -1px;
      height: 2px;
      background: #1890ff;
      border-radius: 2px;
    }
    .sp-inner-pane { display: none; }
    .sp-inner-pane--active { display: block; }
    /* 建设范围清单 · AI 校验 */
    .sp-ai-summary {
      display: none;
      align-items: center;
      gap: 16px;
      margin-bottom: 10px;
      padding: 9px 12px;
      font-size: 12px;
      color: #595959;
      background: #f6ffed;
      border: 1px solid #b7eb8f;
      border-radius: 4px;
    }
    .sp-ai-summary--show { display: flex; }
    .sp-ai-summary strong { font-size: 13px; }
    .sp-ai-ok { color: #389e0d; }
    .sp-ai-miss { color: #d4380d; }
    .sp-ai-extra { color: #d46b08; }
    .sp-ai-note { margin-left: auto; color: #8c8c8c; }
    .sp-conclusion {
      display: inline-block;
      height: 18px;
      line-height: 16px;
      padding: 0 6px;
      font-size: 11px;
      border-radius: 3px;
      white-space: nowrap;
    }
    .sp-conclusion--match { color: #389e0d; background: #f6ffed; border: 1px solid #b7eb8f; }
    .sp-conclusion--miss { color: #d4380d; background: #fff1f0; border: 1px solid #ffa39e; }
    .sp-conclusion--extra { color: #d46b08; background: #fff7e6; border: 1px solid #ffd591; }
    .sp-conclusion--none { color: #8c8c8c; background: #fafafa; border: 1px solid #e8e8e8; }
    .sp-row--miss > td { background: #fff2f0; }
    .sp-row--extra > td { background: #fffbe6; }
    /* 变更记录弹窗 */
    .sp-log-modal {
      display: flex;
      flex-direction: column;
      width: 860px;
      max-width: 92vw;
      max-height: 80vh;
      overflow: hidden;
      background: #fff;
      border-radius: 6px;
    }
    .sp-log-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 46px;
      padding: 0 16px;
      border-bottom: 1px solid #f0f0f0;
    }
    .sp-log-title { font-size: 14px; font-weight: 600; color: #262626; }
    .sp-log-body { padding: 16px; overflow: auto; }
    .sp-log-ver { display: inline-block; height: 18px; line-height: 16px; padding: 0 6px; font-size: 11px; color: #0958d9; background: #e6f4ff; border: 1px solid #91caff; border-radius: 3px; }
    .sp-tpl-type { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font-size: 13px; color: #595959; }

    /* 标段实施计划 · 二期优化 */
    .sp-progress { position: relative; display: inline-block; width: 110px; height: 16px; background: #f0f5ff; border: 1px solid #d6e4ff; border-radius: 8px; vertical-align: middle; overflow: hidden; }
    .sp-progress-inner { position: absolute; left: 0; top: 0; bottom: 0; background: #2f54eb; border-radius: 8px; }
    .sp-progress-text { position: absolute; inset: 0; font-size: 11px; line-height: 15px; text-align: center; color: #1d39c4; }
    .sp-gantt { position: relative; height: 14px; background: #f5f5f5; border: 1px solid #f0f0f0; border-radius: 7px; min-width: 150px; }
    .sp-gantt-bar { position: absolute; top: 2px; height: 8px; background: #ffe58f; border: 1px solid #fadb14; border-radius: 4px; overflow: hidden; }
    .sp-gantt-prog { height: 100%; background: #1890ff; }
    .sp-gantt-prog--done { background: #52c41a; }
    .sp-gantt-prog--zero { background: transparent; }
    .sp-lock-icon { display: inline-block; width: 12px; height: 12px; fill: #bfbfbf; flex-shrink: 0; }
    .sp-new-badge { display: inline-block; height: 16px; line-height: 14px; padding: 0 5px; margin-left: 6px; font-size: 11px; color: #389e0d; background: #f6ffed; border: 1px solid #b7eb8f; border-radius: 3px; vertical-align: middle; }
    .sp-lvl-badge { display: inline-block; height: 18px; line-height: 16px; padding: 0 6px; font-size: 11px; border-radius: 3px; white-space: nowrap; }
    .sp-lvl-badge--sys { color: #0958d9; background: #e6f4ff; border: 1px solid #91caff; }
    .sp-lvl-badge--mod { color: #531dab; background: #f9f0ff; border: 1px solid #d3adf7; }
    .sp-lvl-badge--func { color: #08979c; background: #e6fffb; border: 1px solid #87e8de; }
    .sp-wbs-done { color: #389e0d; }
    .sp-wbs-doing { color: #d46b08; }
    .sp-wbs-delay { color: #cf1322; }
    .sp-tpl-status { display: inline-block; padding: 0 8px; height: 20px; line-height: 18px; font-size: 11px; border-radius: 10px; }
    .sp-tpl-status--pub { color: #389e0d; background: #f6ffed; border: 1px solid #b7eb8f; }
    .sp-tpl-status--draft { color: #d46b08; background: #fff7e6; border: 1px solid #ffd591; }
    .sp-tpl-status--off { color: #8c8c8c; background: #f5f5f5; border: 1px solid #e8e8e8; }
    /* 项目计划模板 */
    .sp-tpl-code { font-family: Consolas, Monaco, monospace; color: #262626; letter-spacing: .5px; }
    .sp-tpl-node { display: inline-flex; align-items: center; gap: 6px; width: 100%; }
    .sp-tpl-node .table-cell-input { flex: 1; }
    .sp-tpl-branch { color: #bfbfbf; }
    .sp-tpl-ops { display: inline-flex; align-items: center; gap: 2px; flex-shrink: 0; }
    .sp-tpl-ops button { height: 22px; min-width: 24px; padding: 0 6px; font-size: 12px; line-height: 20px; border: 1px solid #e8e8e8; border-radius: 4px; background: #fafafa; color: #595959; cursor: pointer; }
    .sp-tpl-ops button:hover { background: #e6f7ff; border-color: #91d5ff; color: #1890ff; }
    /* 项目交付物配置：左树（标段类型） + 右表（交付物清单） */
    .dcfg-layout { display: flex; align-items: stretch; }
    .dcfg-tree { flex: 0 0 232px; width: 232px; padding: 12px 0 12px 12px; border-right: 1px solid #f0f0f0; box-sizing: border-box; }
    .dcfg-tree-head { padding: 0 8px 10px; font-size: 12px; color: #8c8c8c; }
    .dcfg-tree-root { display: flex; align-items: center; gap: 6px; padding: 6px 8px; font-size: 13px; font-weight: 600; color: #262626; }
    .dcfg-tree-list { list-style: none; margin: 0; padding: 0 0 0 16px; }
    .dcfg-tree-node { display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 4px; font-size: 13px; color: #595959; cursor: pointer; }
    .dcfg-tree-node:hover { background: #f5f9ff; color: #1890ff; }
    .dcfg-tree-node--active { background: #e6f7ff; color: #1890ff; font-weight: 600; }
    .dcfg-tree-dot { width: 6px; height: 6px; border-radius: 50%; background: #d9d9d9; flex-shrink: 0; }
    .dcfg-tree-node--active .dcfg-tree-dot { background: #1890ff; }
    .dcfg-tree-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .dcfg-tree-count { flex-shrink: 0; font-size: 11px; color: #bfbfbf; }
    .dcfg-tree-node--active .dcfg-tree-count { color: #69b1ff; }
    .dcfg-main { flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 12px 12px 0; box-sizing: border-box; }
    .dcfg-main .table-scroll { padding: 0; }
    .dcfg-main .table-footer { padding: 10px 0 12px; }
    .dcfg-idx { display: inline-flex; align-items: center; gap: 8px; }
    .dcfg-tpl { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; }
    .dcfg-tpl-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color: #595959; }
    .dcfg-tpl-name--empty { color: #bfbfbf; }
    .sp-tpl-flag-toggle { display: inline-flex; cursor: pointer; }
    .sp-tpl-flag { width: 15px; height: 15px; fill: #d9d9d9; }
    .sp-tpl-flag--on { fill: #f5222d; }
    .sp-accept-toggle { display: inline-block; height: 20px; line-height: 18px; padding: 0 8px; font-size: 11px; border-radius: 10px; border: 1px solid #e8e8e8; background: #fafafa; color: #8c8c8c; cursor: pointer; }
    .sp-accept-toggle--on { color: #389e0d; background: #f6ffed; border-color: #b7eb8f; }
    .toolbar-btn[disabled] { opacity: .5; cursor: not-allowed; }
    .sp-pane-bar { display: flex; align-items: center; gap: 8px; padding: 10px 12px 0; }
    .sp-pane-hint { font-size: 12px; color: #8c8c8c; }

    /* 项目计划模板 · 版本历史 / 版本对比 / 回滚 */
    .sp-ver-item { display: inline-flex; align-items: center; gap: 5px; }
    .sp-ver-sep { color: #bfbfbf; margin: 0 5px; }
    a.sp-ver-chip { cursor: pointer; text-decoration: none; }
    a.sp-ver-chip:hover { border-color: #0958d9; }
    .sp-ver-badge { display: inline-block; height: 16px; line-height: 14px; padding: 0 5px; font-size: 10px; border-radius: 3px; border: 1px solid; }
    .sp-ver-badge--on { color: #389e0d; background: #f6ffed; border-color: #b7eb8f; }
    .sp-ver-badge--off { color: #8c8c8c; background: #f5f5f5; border-color: #e8e8e8; }
    .row-link--danger { color: #cf1322; }
    .sp-diff-controls { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid #f0f0f0; flex-wrap: wrap; }
    .sp-diff-controls .sp-pane-hint { white-space: nowrap; }
    .sp-diff-sel { height: 28px; border: 1px solid #d9d9d9; border-radius: 4px; padding: 0 8px; font-size: 13px; min-width: 210px; background: #fff; color: #262626; }
    .sp-diff-swap { height: 28px; padding: 0 10px; border: 1px solid #d9d9d9; border-radius: 4px; background: #fafafa; cursor: pointer; font-size: 12px; color: #595959; }
    .sp-diff-swap:hover { border-color: #2f54eb; color: #2f54eb; }
    .sp-diff-stats { display: flex; align-items: center; gap: 8px; margin-left: auto; font-size: 12px; }
    .sp-diff-stat { display: inline-flex; align-items: center; gap: 4px; height: 20px; padding: 0 8px; border-radius: 10px; border: 1px solid; }
    .sp-diff-stat b { font-size: 12px; }
    .sp-diff-stat--add { color: #389e0d; background: #f6ffed; border-color: #b7eb8f; }
    .sp-diff-stat--del { color: #cf1322; background: #fff1f0; border-color: #ffa39e; }
    .sp-diff-stat--mod { color: #d46b08; background: #fff7e6; border-color: #ffd591; }
    .sp-diff-stat--same { color: #8c8c8c; background: #fafafa; border-color: #e8e8e8; }
    .sp-diff-table td, .sp-diff-table th { font-size: 12px; }
    .sp-diff-row--add > td { background: #f6ffed; }
    .sp-diff-row--del > td { background: #fff1f0; }
    .sp-diff-row--mod > td { background: #fffbe6; }
    .sp-diff-row--same { color: #a6a6a6; }
    .sp-diff-badge { display: inline-block; min-width: 38px; text-align: center; height: 18px; line-height: 17px; padding: 0 6px; font-size: 11px; border-radius: 9px; border: 1px solid; }
    .sp-diff-badge--add { color: #389e0d; background: #f6ffed; border-color: #b7eb8f; }
    .sp-diff-badge--del { color: #cf1322; background: #fff1f0; border-color: #ffa39e; }
    .sp-diff-badge--mod { color: #d46b08; background: #fff7e6; border-color: #ffd591; }
    .sp-diff-badge--same { color: #8c8c8c; background: #fafafa; border-color: #e8e8e8; }
    .sp-diff-name-del { color: #cf1322; text-decoration: line-through; }
    .sp-diff-name-add { color: #389e0d; font-weight: 600; }
    .sp-diff-cell--chg { display: inline-flex; align-items: center; white-space: nowrap; }
    .sp-diff-old { color: #cf1322; background: #fff1f0; text-decoration: line-through; border-radius: 2px; padding: 0 3px; }
    .sp-diff-new { color: #389e0d; background: #f6ffed; border-radius: 2px; padding: 0 3px; }
    .sp-diff-arrow { color: #bfbfbf; margin: 0 4px; }
    .sp-diff-yes { color: #f5222d; font-weight: 600; }
    .sp-diff-yes--accept { color: #389e0d; }
    .sp-diff-no { color: #bfbfbf; }
    .sp-diff-empty { text-align: center; color: #8c8c8c; padding: 48px 0 !important; }
    .sp-diff-remark { color: #595959; }
    .sp-diff-row--same .sp-diff-remark { color: #a6a6a6; }

    /* ========== 新业务模块通用组件（软件研发设计 / 系统配置管理） ========== */
    .biz-filter-bar { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; background: #fff; border: 1px solid #e7e8ef; border-radius: 6px; padding: 12px 16px; margin-bottom: 14px; }
    .biz-filter-item { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #444c57; }
    .biz-filter-item select, .biz-filter-item input { height: 30px; border: 1px solid #d9d9d9; border-radius: 4px; padding: 0 8px; font-size: 13px; min-width: 150px; background: #fff; }
    .biz-filter-item select:focus, .biz-filter-item input:focus { outline: none; border-color: #2495c7; }
    .biz-btn { display: inline-block; height: 30px; line-height: 28px; padding: 0 14px; border: 1px solid #d9d9d9; border-radius: 4px; background: #fff; color: #444c57; font-size: 13px; cursor: pointer; }
    .biz-btn:hover { border-color: #2495c7; color: #2495c7; }
    .biz-btn--primary { background: #2495c7; border-color: #2495c7; color: #fff; }
    .biz-btn--primary:hover { background: #1d7faa; color: #fff; }
    .biz-btn--danger { color: #ff4848; border-color: #ffccc7; }
    .biz-btn--danger:hover { border-color: #ff4848; color: #ff4848; }
    .biz-btn[disabled] { color: #bfbfbf !important; border-color: #e8e8e8 !important; background: #fafafa !important; cursor: not-allowed; }
    .biz-stepbar { display: flex; align-items: flex-start; margin: 6px 0 4px; overflow-x: auto; padding-bottom: 4px; }
    .biz-step { position: relative; flex: 1 1 0; min-width: 110px; text-align: center; font-size: 12.5px; color: #90929b; }
    .biz-step-dot { width: 26px; height: 26px; line-height: 26px; border-radius: 50%; background: #f0f2f5; color: #90929b; margin: 0 auto 6px; font-size: 13px; border: 1px solid #e0e3e8; z-index: 2; position: relative; }
    .biz-step::before { content: ''; position: absolute; top: 13px; left: -50%; width: 100%; height: 2px; background: #e0e3e8; z-index: 0; }
    .biz-step:first-child::before { display: none; }
    .biz-step--done { color: #26a94e; }
    .biz-step--done .biz-step-dot { background: #26a94e; border-color: #26a94e; color: #fff; }
    .biz-step--done::before { background: #26a94e; }
    .biz-step--active { color: #2495c7; font-weight: 600; }
    .biz-step--active .biz-step-dot { background: #2495c7; border-color: #2495c7; color: #fff; box-shadow: 0 0 0 4px rgba(36,149,199,.15); }
    .biz-step--reject { color: #ff4848; }
    .biz-step--reject .biz-step-dot { background: #ff4848; border-color: #ff4848; color: #fff; }
    .biz-tag { display: inline-block; padding: 1px 8px; border-radius: 3px; font-size: 12px; line-height: 18px; border: 1px solid transparent; white-space: nowrap; }
    .biz-tag--draft { color: #90929b; background: #f4f5f9; border-color: #e2e4ea; }
    .biz-tag--wait { color: #f39800; background: #fff7e8; border-color: #ffe2ad; }
    .biz-tag--pass { color: #26a94e; background: #eafaf0; border-color: #b7ebc8; }
    .biz-tag--reject { color: #ff4848; background: #fff1f0; border-color: #ffccc7; }
    .biz-tag--doing { color: #2495c7; background: #e8f6fc; border-color: #a9dff2; }
    .biz-tag--archived { color: #192c57; background: #eef1f7; border-color: #d3dae6; }
    .biz-tag--off { color: #90929b; background: #f4f5f9; border-color: #e2e4ea; }
    .biz-timeline { list-style: none; padding: 4px 0 4px 8px; }
    .biz-timeline-item { position: relative; padding: 0 0 16px 20px; border-left: 2px solid #e7e8ef; font-size: 13px; color: #444c57; }
    .biz-timeline-item:last-child { padding-bottom: 0; }
    .biz-timeline-item::before { content: ''; position: absolute; left: -6px; top: 3px; width: 10px; height: 10px; border-radius: 50%; background: #2495c7; }
    .biz-timeline-item--gray::before { background: #c4cad3; }
    .biz-timeline-time { color: #90929b; font-size: 12px; margin-right: 8px; }
    .biz-timeline-user { color: #192c57; font-weight: 600; margin-right: 8px; }
    .biz-timeline-op { color: #2495c7; }
    .biz-timeline-reason { margin-top: 4px; color: #ff4848; background: #fff1f0; border: 1px solid #ffccc7; border-radius: 4px; padding: 6px 10px; }
    .biz-mask { position: fixed; inset: 0; background: rgba(20,32,52,.45); z-index: 900; display: none; align-items: center; justify-content: center; }
    .biz-mask--show { display: flex; }
    .biz-modal { background: #fff; border-radius: 8px; width: 480px; max-width: 92vw; max-height: 88vh; overflow: auto; box-shadow: 0 12px 40px rgba(0,0,0,.22); }
    .biz-modal--wide { width: 820px; }
    .biz-modal-header { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; border-bottom: 1px solid #eef0f4; font-size: 15px; font-weight: 600; color: #192c57; }
    .biz-modal-close { border: none; background: none; font-size: 20px; color: #999; cursor: pointer; line-height: 1; }
    .biz-modal-body { padding: 18px 20px; }
    .biz-modal-footer { padding: 12px 20px; border-top: 1px solid #eef0f4; text-align: right; }
    .biz-modal-footer .biz-btn { margin-left: 10px; }
    .biz-modal-body textarea { width: 100%; min-height: 84px; border: 1px solid #d9d9d9; border-radius: 4px; padding: 8px 10px; font-size: 13px; resize: vertical; font-family: inherit; }
    .biz-modal-body textarea:focus { outline: none; border-color: #2495c7; }
    .biz-diff { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    .biz-diff-col { border: 1px solid #e7e8ef; border-radius: 6px; overflow: hidden; }
    .biz-diff-head { padding: 8px 14px; font-size: 13px; font-weight: 600; background: #f4f5f9; color: #192c57; }
    .biz-diff-head--old { color: #b3541e; background: #fdf4ec; }
    .biz-diff-head--new { color: #1d6f3a; background: #ecf9f0; }
    .biz-diff-body { padding: 12px 14px; font-size: 13px; }
    .biz-diff-body .biz-diff-row { display: flex; padding: 5px 0; border-bottom: 1px dashed #eef0f4; }
    .biz-diff-body .biz-diff-row:last-child { border-bottom: none; }
    .biz-diff-k { width: 96px; color: #90929b; flex-shrink: 0; }
    .biz-diff-v { color: #444c57; word-break: break-all; }
    .biz-diff-v--del { color: #b3541e; text-decoration: line-through; }
    .biz-diff-v--add { color: #1d6f3a; }
    .biz-secret { letter-spacing: 2px; color: #90929b; font-family: Consolas, monospace; }
    .biz-checklist { list-style: none; }
    .biz-checklist li { display: flex; align-items: flex-start; gap: 8px; padding: 8px 0; border-bottom: 1px dashed #eef0f4; font-size: 13px; color: #444c57; }
    .biz-checklist li:last-child { border-bottom: none; }
    .biz-check-ico { flex-shrink: 0; width: 18px; height: 18px; line-height: 18px; text-align: center; border-radius: 50%; font-size: 12px; color: #fff; margin-top: 1px; }
    .biz-check-ico--ok { background: #26a94e; }
    .biz-check-ico--warn { background: #f39800; }
    .biz-check-ico--no { background: #ff4848; }
    .biz-desc-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px 24px; font-size: 13px; }
    .biz-desc-list--full { grid-template-columns: 1fr; }
    .biz-desc-item { display: flex; gap: 8px; line-height: 22px; }
    .biz-desc-k { color: #90929b; flex-shrink: 0; min-width: 92px; }
    .biz-desc-v { color: #444c57; word-break: break-all; }
    .biz-empty { text-align: center; color: #b0b6bf; padding: 30px 0; font-size: 13px; }
    .biz-link-btn { color: #2495c7; cursor: pointer; background: none; border: none; font-size: 13px; padding: 0; }
    .biz-link-btn:hover { text-decoration: underline; }
    .biz-alert { border: 1px solid #ffd591; background: #fff7e8; color: #ad6800; border-radius: 4px; padding: 8px 12px; font-size: 12.5px; margin-bottom: 12px; }
    .biz-alert--danger { border-color: #ffccc7; background: #fff1f0; color: #cf1322; }
    .biz-alert--info { border-color: #a9dff2; background: #e8f6fc; color: #0e6b96; }
    .biz-progress { display: inline-flex; align-items: center; gap: 8px; }
    .biz-progress-bar { width: 90px; height: 6px; background: #eef0f4; border-radius: 3px; overflow: hidden; }
    .biz-progress-inner { height: 100%; background: #2495c7; border-radius: 3px; }
    .biz-overdue { color: #ff4848; font-size: 12px; margin-left: 6px; }
    .biz-file-row { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: #444c57; padding: 4px 0; }
    .biz-file-ico { width: 26px; height: 26px; border-radius: 4px; background: #e8f6fc; color: #2495c7; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; flex-shrink: 0; }
    .biz-check-row { display: flex; align-items: center; gap: 8px; padding: 6px 0; font-size: 13px; border-bottom: 1px dashed #eef0f4; }
    .biz-check-row:last-child { border-bottom: none; }

    .hidden { display: none !important; }