/* 企业版交互扩展：深层页面、数据运维、产品导览、大屏与可读性 */

.tour-launch {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  gap: 7px;
  padding: 0 13px;
  color: var(--green);
  background: var(--green-soft);
  border: 1px solid #d3e7dc;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
}

.tour-launch svg {
  width: 17px;
  height: 17px;
}

.quality-icon {
  color: white;
  background: linear-gradient(135deg, var(--green), #2f9470);
  box-shadow: 0 6px 16px rgba(23, 107, 79, 0.2);
}

.quality-icon svg {
  stroke-width: 2.2;
}

/* 专业洞察深层视图 */
.profession-tab-view {
  min-width: 0;
}

.profession-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.profession-detail-panel {
  min-width: 0;
}

.profession-detail-panel.wide {
  grid-column: 1 / -1;
}

.job-flow-board {
  display: grid;
  min-height: 360px;
  grid-template-columns: 150px minmax(80px, 0.4fr) minmax(285px, 1fr);
  align-items: center;
  gap: 12px;
  margin-top: 18px;
  padding: 22px;
  overflow: hidden;
  background: linear-gradient(110deg, #f5faf7, #fbfcfb);
  border: 1px solid #e4ece7;
  border-radius: 14px;
}

.job-flow-source {
  display: grid;
  min-height: 150px;
  place-items: center;
  align-content: center;
  color: white;
  background: linear-gradient(145deg, #176b4f, #104735);
  border-radius: 18px;
  text-align: center;
}

.job-flow-source span,
.job-flow-source strong,
.job-flow-source small {
  display: block;
}

.job-flow-source span {
  font-size: 14px;
}

.job-flow-source strong {
  margin: 8px 0 2px;
  color: var(--lime);
  font-size: 34px;
}

.job-flow-source small {
  color: #adcbc0;
  font-size: 13px;
}

.job-flow-lines {
  position: relative;
  height: 300px;
}

.job-flow-lines::before,
.job-flow-lines::after {
  position: absolute;
  top: 50%;
  width: 14px;
  height: 14px;
  background: var(--green);
  border-radius: 50%;
  content: "";
  transform: translateY(-50%);
}

.job-flow-lines::before {
  left: -5px;
}

.job-flow-lines::after {
  right: -5px;
  background: #72b893;
}

.job-flow-lines i {
  position: absolute;
  top: var(--flow-top);
  right: 0;
  left: 0;
  height: var(--flow-width);
  background: linear-gradient(90deg, rgba(23, 107, 79, 0.82), rgba(114, 184, 147, 0.5));
  border-radius: 50%;
}

.job-flow-targets {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.job-flow-targets > span {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 10px 12px;
  background: white;
  border: 1px solid #e2eae5;
  border-radius: 10px;
}

.job-flow-targets b {
  color: var(--green);
  font-size: 13px;
}

.job-flow-targets strong {
  font-size: 14px;
}

.job-flow-targets small {
  color: var(--muted);
  font-size: 13px !important;
}

.job-flow-targets i {
  grid-column: 2 / -1;
  display: block;
  height: 6px;
  overflow: hidden;
  background: #edf2ee;
  border-radius: 4px;
}

.job-flow-targets i em,
.region-distribution-list i em {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--green), #72b893);
  border-radius: 4px;
}

.region-distribution-list,
.salary-factor-list,
.course-gap-list {
  display: flex;
  flex-direction: column;
  gap: 13px;
  margin-top: 18px;
}

.region-distribution-list > span {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px 12px;
}

.region-distribution-list strong,
.salary-factor-list strong,
.course-gap-list strong {
  font-size: 14px;
}

.region-distribution-list small,
.salary-factor-list small,
.course-gap-list small {
  color: var(--muted);
  font-size: 13px !important;
}

.region-distribution-list i {
  grid-column: 1 / -1;
  display: block;
  height: 8px;
  overflow: hidden;
  background: #edf2ee;
  border-radius: 5px;
}

.employer-structure {
  display: flex;
  min-height: 225px;
  align-items: flex-end;
  justify-content: space-around;
  gap: 14px;
  margin-top: 18px;
}

.employer-structure > span {
  display: flex;
  min-width: 0;
  flex: 1;
  align-items: center;
  flex-direction: column;
  text-align: center;
}

.employer-structure > span::before {
  width: min(105px, 100%);
  height: calc(var(--share) * 3.1px);
  max-height: 135px;
  margin-bottom: 10px;
  background: linear-gradient(180deg, #72b893, var(--green));
  border-radius: 12px 12px 3px 3px;
  content: "";
}

.employer-structure strong {
  font-size: 14px;
}

.employer-structure small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 13px !important;
}

.profession-evidence-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
  padding: 15px 17px;
  color: #285041;
  background: #edf7f1;
  border: 1px solid #d8eade;
  border-radius: 12px;
}

.profession-evidence-note > span {
  padding: 5px 8px;
  color: white;
  background: var(--green);
  border-radius: 6px;
  font-size: 13px;
  font-weight: 800;
}

.profession-evidence-note p {
  margin: 0;
  font-size: 14px !important;
}

.profession-evidence-note button {
  padding: 8px 10px;
  color: var(--green);
  background: white;
  border: 1px solid #cfe2d6;
  border-radius: 8px;
  font-size: 13px !important;
  font-weight: 700;
}

.salary-index {
  padding: 7px 10px;
  color: var(--green);
  background: var(--green-soft);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
}

.salary-index.warning {
  color: #9a6818;
  background: var(--amber-soft);
}

.salary-comparison {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin-top: 24px;
}

.salary-comparison > span {
  display: grid;
  grid-template-columns: 165px minmax(0, 1fr) 92px;
  align-items: center;
  gap: 13px;
}

.salary-comparison strong {
  font-size: 14px;
}

.salary-comparison i {
  height: 15px;
  overflow: hidden;
  background: #edf2ee;
  border-radius: 8px;
}

.salary-comparison i em {
  display: block;
  height: 100%;
  background: var(--green);
  border-radius: 8px;
}

.salary-comparison i em.region {
  background: #4d7fa8;
}

.salary-comparison i em.peer {
  background: #d39a35;
}

.salary-comparison b {
  font-size: 15px;
  text-align: right;
}

.salary-range {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  margin-top: 30px;
  padding: 18px;
  background: #f8faf8;
  border-radius: 12px;
}

.salary-range span small,
.salary-range span strong {
  display: block;
}

.salary-range span small {
  color: var(--muted);
  font-size: 13px !important;
}

.salary-range span strong {
  margin-top: 3px;
  font-size: 15px;
}

.salary-range > i {
  position: relative;
  height: 9px;
  background: #dfe8e2;
  border-radius: 5px;
}

.salary-range > i b {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #72b893, var(--green));
  border-radius: 5px;
}

.salary-range > i em {
  position: absolute;
  top: 50%;
  width: 17px;
  height: 17px;
  background: var(--lime);
  border: 3px solid var(--green);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.salary-sample-card,
.coverage-summary {
  display: flex;
  min-height: 210px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}

.salary-sample-card > strong,
.coverage-summary > strong {
  color: var(--green);
  font-size: 44px;
}

.salary-sample-card > span,
.coverage-summary > span {
  font-size: 14px;
  font-weight: 700;
}

.salary-sample-card > small,
.coverage-summary > small {
  max-width: 340px;
  margin-top: 12px;
  color: var(--muted);
  font-size: 13px !important;
  line-height: 1.7;
}

.salary-factor-list span {
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 14px;
  background: #f8faf8;
  border-radius: 10px;
}

.salary-factor-list b {
  color: var(--green);
  font-size: 20px;
}

.matrix-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
}

.matrix-legend i {
  width: 9px;
  height: 9px;
  margin-left: 5px;
  background: var(--green);
  border-radius: 3px;
}

.matrix-legend i:nth-of-type(2) {
  background: var(--amber);
}

.matrix-legend i:nth-of-type(3) {
  background: var(--red);
}

.course-matrix-wrap {
  max-width: 100%;
  margin-top: 18px;
  overflow-x: auto;
}

.course-matrix {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
}

.course-matrix th,
.course-matrix td {
  padding: 12px 10px;
  border-bottom: 1px solid var(--line-soft);
  font-size: 13px;
  text-align: center;
}

.course-matrix th:first-child,
.course-matrix td:first-child {
  min-width: 145px;
  text-align: left;
}

.course-matrix td:first-child strong,
.course-matrix td:first-child small {
  display: block;
}

.course-matrix td:first-child small {
  color: var(--muted);
  font-size: 13px !important;
}

.matrix-cell {
  display: inline-grid;
  width: 34px;
  height: 34px;
  place-items: center;
  color: white;
  background: var(--green);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
}

.matrix-cell.partial {
  background: var(--amber);
}

.matrix-cell.gap {
  background: var(--red);
}

.course-matrix button {
  padding: 7px 9px;
  color: var(--green);
  background: var(--green-soft);
  border-radius: 7px;
  font-size: 13px !important;
  font-weight: 700;
}

.coverage-summary > i {
  width: 80%;
  height: 10px;
  margin-top: 14px;
  overflow: hidden;
  background: #e8eee9;
  border-radius: 6px;
}

.coverage-summary > i b {
  display: block;
  height: 100%;
  background: var(--green);
}

.course-gap-list > span {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 3px 10px;
  padding: 12px;
  background: #f8faf8;
  border-radius: 9px;
}

.course-gap-list b {
  grid-row: 1 / 3;
  color: var(--red);
}

/* 抽屉 */
.data-ops-backdrop,
.workspace-detail-backdrop {
  position: fixed;
  z-index: 125;
  inset: 0;
  background: rgba(8, 25, 19, 0.54);
  backdrop-filter: blur(4px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
}

.data-ops-backdrop.open,
.workspace-detail-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

.data-ops-drawer,
.workspace-detail-drawer {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  width: min(780px, 94vw);
  height: 100%;
  flex-direction: column;
  overflow: hidden;
  background: #f6f8f5;
  box-shadow: -24px 0 70px rgba(10, 32, 23, 0.22);
  transform: translateX(24px);
  transition: transform 0.22s ease;
}

.workspace-detail-drawer {
  width: min(680px, 94vw);
}

.data-ops-backdrop.open .data-ops-drawer,
.workspace-detail-backdrop.open .workspace-detail-drawer {
  transform: translateX(0);
}

.data-ops-header,
.workspace-detail-header {
  display: flex;
  flex: 0 0 auto;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 25px 26px 20px;
  background: white;
  border-bottom: 1px solid var(--line);
}

.data-ops-header > div > span,
.workspace-detail-header > div > span {
  color: var(--green-2);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.09em;
}

.data-ops-header h2,
.workspace-detail-header h2 {
  margin: 6px 0 5px;
  font-size: 25px;
}

.data-ops-header p,
.workspace-detail-header p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.data-ops-header button,
.workspace-detail-header button,
.product-tour-close,
.showcase-header-actions button {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  place-items: center;
  color: var(--muted);
  background: #f0f4f1;
  border-radius: 10px;
}

.data-ops-header button svg,
.workspace-detail-header button svg,
.product-tour-close svg,
.showcase-header-actions button svg {
  width: 17px;
  height: 17px;
}

.data-ops-tabs {
  display: flex;
  flex: 0 0 auto;
  gap: 5px;
  padding: 10px 22px;
  overflow-x: auto;
  background: white;
  border-bottom: 1px solid var(--line);
}

.data-ops-tabs button {
  flex: 0 0 auto;
  padding: 8px 11px;
  color: var(--muted);
  background: transparent;
  border-radius: 8px;
  font-size: 13px;
}

.data-ops-tabs button.active {
  color: white;
  background: var(--green);
  font-weight: 700;
}

.data-ops-content,
.workspace-detail-content {
  min-height: 0;
  flex: 1;
  padding: 20px 24px 34px;
  overflow-y: auto;
}

.data-ops-footer,
.workspace-detail-footer {
  display: flex;
  flex: 0 0 auto;
  justify-content: flex-end;
  gap: 9px;
  padding: 14px 22px;
  background: white;
  border-top: 1px solid var(--line);
}

.data-ops-stat-grid,
.batch-update-summary,
.authorization-summary-grid,
.workspace-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.batch-update-summary,
.authorization-summary-grid,
.workspace-metric-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.data-ops-stat-grid > span,
.batch-update-summary > span,
.authorization-summary-grid > span,
.workspace-metric-grid > span {
  min-width: 0;
  padding: 14px;
  background: white;
  border: 1px solid var(--line-soft);
  border-radius: 11px;
}

.data-ops-stat-grid small,
.data-ops-stat-grid strong,
.data-ops-stat-grid em,
.batch-update-summary small,
.batch-update-summary strong,
.batch-update-summary em,
.authorization-summary-grid small,
.authorization-summary-grid strong,
.authorization-summary-grid em,
.workspace-metric-grid small,
.workspace-metric-grid strong,
.workspace-metric-grid em {
  display: block;
}

.data-ops-stat-grid small,
.batch-update-summary small,
.authorization-summary-grid small,
.workspace-metric-grid small {
  color: var(--muted);
  font-size: 13px;
}

.data-ops-stat-grid strong,
.batch-update-summary strong,
.authorization-summary-grid strong,
.workspace-metric-grid strong {
  margin: 7px 0 4px;
  font-size: 17px;
}

.data-ops-stat-grid em,
.batch-update-summary em,
.authorization-summary-grid em,
.workspace-metric-grid em {
  color: var(--green-2);
  font-size: 13px;
  font-style: normal;
}

.data-ops-highlight,
.data-issue-hero,
.data-authorization-card {
  margin-top: 12px;
  padding: 18px;
  color: #eaf3ef;
  background: linear-gradient(135deg, #174535, #102f26);
  border-radius: 13px;
}

.data-ops-highlight > span,
.data-issue-hero > span,
.data-authorization-card > span {
  color: var(--lime);
  font-size: 13px;
  font-weight: 800;
}

.data-ops-highlight > strong,
.data-issue-hero h3,
.data-authorization-card > strong {
  display: block;
  margin: 7px 0 6px;
  color: white;
  font-size: 17px;
}

.data-ops-highlight p,
.data-issue-hero p,
.data-authorization-card p {
  margin: 0;
  color: #a8bdb5;
  font-size: 14px;
  line-height: 1.7;
}

.data-authorization-card > div {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 14px;
}

.data-authorization-card > div span {
  padding: 10px;
  color: #8fa99e;
  background: rgba(255, 255, 255, 0.055);
  border-radius: 8px;
  font-size: 13px;
}

.data-authorization-card > div strong {
  display: block;
  margin-top: 4px;
  color: white;
  font-size: 14px;
  overflow-wrap: anywhere;
}

.data-ops-two-column {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px;
  margin-top: 12px;
}

.data-ops-card,
.workspace-detail-card {
  margin-top: 12px;
  padding: 17px;
  background: white;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
}

.data-ops-card h3,
.workspace-detail-card h3 {
  margin: 0 0 12px;
  font-size: 16px;
}

.data-ops-card p,
.workspace-detail-card p,
.data-ops-card li {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.75;
}

.data-ops-card ul {
  margin: 10px 0 0;
  padding-left: 20px;
}

.data-ops-card dl {
  margin: 0;
}

.data-ops-card dl > div {
  display: grid;
  grid-template-columns: 115px 1fr;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line-soft);
}

.data-ops-card dl > div:last-child {
  border-bottom: 0;
}

.data-ops-card dt {
  color: var(--muted);
  font-size: 13px;
}

.data-ops-card dd {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}

.data-ops-state {
  display: inline-flex;
  padding: 4px 7px;
  color: var(--green);
  background: var(--green-soft);
  border-radius: 6px;
  font-size: 13px;
}

.data-ops-state.warning {
  color: #9a6818;
  background: var(--amber-soft);
}

.data-quality-meter {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
}

.data-quality-meter > i {
  height: 12px;
  overflow: hidden;
  background: #e7eee9;
  border-radius: 7px;
}

.data-quality-meter > i b {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--green), #72b893);
}

.data-quality-meter > strong {
  color: var(--green);
  font-size: 20px;
}

.data-contract-hero {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.data-contract-hero > div {
  padding: 16px;
  background: white;
  border: 1px solid var(--line-soft);
  border-radius: 11px;
}

.data-contract-hero span,
.data-contract-hero strong,
.data-contract-hero small {
  display: block;
}

.data-contract-hero span,
.data-contract-hero small {
  color: var(--muted);
  font-size: 13px;
}

.data-contract-hero strong {
  margin: 7px 0 4px;
  font-size: 15px;
  word-break: break-word;
}

.data-requirement-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.data-requirement-steps > span {
  padding: 12px;
  background: #f7faf7;
  border-radius: 9px;
}

.data-requirement-steps b,
.data-requirement-steps strong,
.data-requirement-steps small {
  display: block;
}

.data-requirement-steps b {
  color: var(--green);
  font-size: 13px;
}

.data-requirement-steps strong {
  margin: 6px 0 5px;
  font-size: 14px;
}

.data-requirement-steps small {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}

.data-field-tags,
.workspace-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.data-field-tags span,
.workspace-tag-row span {
  padding: 7px 9px;
  color: var(--green);
  background: var(--green-soft);
  border-radius: 7px;
  font-size: 13px;
  font-weight: 600;
}

.data-ops-table {
  width: 100%;
  border-collapse: collapse;
}

.data-ops-table th,
.data-ops-table td {
  padding: 11px 9px;
  border-bottom: 1px solid var(--line-soft);
  font-size: 13px;
  text-align: left;
}

.data-ops-table th {
  color: var(--muted);
  background: #f5f8f5;
}

.data-task-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 14px 16px;
  color: var(--green);
  background: var(--green-soft);
  border: 1px solid #d4e7dc;
  border-radius: 11px;
}

.data-task-banner.warning {
  color: #9b6816;
  background: var(--amber-soft);
}

.data-task-banner span {
  display: flex;
  align-items: center;
  gap: 9px;
}

.data-task-banner span i {
  width: 8px;
  height: 8px;
  background: currentColor;
  border-radius: 50%;
}

.data-task-banner strong,
.data-task-banner em {
  font-size: 14px;
}

.data-task-banner em {
  font-style: normal;
  font-weight: 700;
}

.data-version-timeline {
  position: relative;
  margin-top: 14px;
  padding: 4px 0 4px 23px;
}

.data-version-timeline::before {
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 8px;
  width: 2px;
  background: #dbe5df;
  content: "";
}

.data-version-timeline article {
  position: relative;
  padding: 0 0 20px 15px;
}

.data-version-timeline article > i {
  position: absolute;
  top: 5px;
  left: -22px;
  width: 13px;
  height: 13px;
  background: #b5c3ba;
  border: 3px solid #f6f8f5;
  border-radius: 50%;
}

.data-version-timeline article.active > i {
  background: var(--green);
}

.data-version-timeline article.warning > i {
  background: var(--amber);
}

.data-version-timeline span,
.data-version-timeline strong,
.data-version-timeline small {
  display: block;
}

.data-version-timeline span {
  color: var(--green);
  font-size: 13px;
  font-weight: 800;
}

.data-version-timeline strong {
  margin: 4px 0;
  font-size: 14px;
}

.data-version-timeline p {
  margin: 4px 0;
  color: var(--muted);
  font-size: 14px;
}

.data-version-timeline small {
  color: #8a9690;
  font-size: 13px;
}

.data-audit-list,
.workspace-log-list {
  display: flex;
  flex-direction: column;
}

.data-audit-list > span,
.workspace-log-list > span {
  position: relative;
  padding: 11px 0 11px 18px;
  border-bottom: 1px solid var(--line-soft);
}

.data-audit-list strong,
.data-audit-list small,
.workspace-log-list strong,
.workspace-log-list small {
  display: block;
}

.data-audit-list strong,
.workspace-log-list strong {
  font-size: 14px;
}

.data-audit-list small,
.workspace-log-list small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.data-wizard-progress {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px;
  background: white;
  border-radius: 11px;
}

.data-wizard-progress span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 13px;
}

.data-wizard-progress span b {
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  background: #edf2ee;
  border-radius: 7px;
}

.data-wizard-progress span.active {
  color: var(--green);
  font-weight: 700;
}

.data-wizard-progress span.active b {
  color: white;
  background: var(--green);
}

.data-wizard-progress > i {
  width: 24px;
  height: 1px;
  background: #d7e0da;
}

.data-source-methods {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.data-source-methods button {
  padding: 13px;
  background: #f7f9f7;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  text-align: left;
}

.data-source-methods button.active {
  background: var(--green-soft);
  border-color: #bddcc9;
}

.data-source-methods strong,
.data-source-methods small {
  display: block;
}

.data-source-methods strong {
  font-size: 14px;
}

.data-source-methods small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.data-form-grid,
.workspace-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 16px;
}

.data-form-grid label.full,
.workspace-form-grid label.full {
  grid-column: 1 / -1;
}

.data-form-grid label > span,
.workspace-form-grid label > span {
  display: block;
  margin-bottom: 6px;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 600;
}

.data-form-grid input,
.data-form-grid select,
.data-form-grid textarea,
.workspace-form-grid input,
.workspace-form-grid select,
.workspace-form-grid textarea {
  width: 100%;
  padding: 10px 11px;
  background: #fafbf9;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 14px;
}

.data-impact-grid,
.security-control-grid,
.workspace-evidence-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.security-control-grid {
  grid-template-columns: repeat(2, 1fr);
}

.data-impact-grid span,
.security-control-grid span,
.workspace-evidence-list span {
  padding: 11px;
  color: var(--muted);
  background: #f7f9f7;
  border-radius: 8px;
  font-size: 13px;
}

.data-impact-grid strong,
.security-control-grid strong,
.workspace-evidence-list strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
  font-size: 14px;
}

.batch-source-list {
  display: flex;
  flex-direction: column;
}

.batch-source-list label {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid var(--line-soft);
}

.batch-source-list input {
  width: 17px;
  height: 17px;
  accent-color: var(--green);
}

.batch-source-list strong,
.batch-source-list small {
  display: block;
}

.batch-source-list strong {
  font-size: 14px;
}

.batch-source-list small,
.batch-source-list em {
  color: var(--muted);
  font-size: 13px;
}

.batch-source-list em {
  color: var(--green);
  font-style: normal;
  font-weight: 600;
}

.batch-source-list em.warning {
  color: #9b6816;
}

.source-card-actions {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}

.source-card-actions button:first-child {
  color: var(--ink-soft);
  background: white;
  border: 1px solid var(--line);
}

.platform-contract-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.platform-contract-summary span {
  padding: 9px;
  color: var(--muted);
  background: white;
  border-radius: 8px;
  font-size: 13px;
}

.platform-contract-summary strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
}

/* 业务详情 */
.milestone-list {
  position: relative;
  padding-left: 22px;
}

.milestone-list::before {
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 7px;
  width: 2px;
  background: #dfe7e1;
  content: "";
}

.milestone-list > span {
  position: relative;
  display: block;
  padding: 8px 0 14px;
}

.milestone-list > span i {
  position: absolute;
  top: 12px;
  left: -21px;
  width: 12px;
  height: 12px;
  background: #bdc9c1;
  border: 3px solid white;
  border-radius: 50%;
}

.milestone-list > span.done i {
  background: var(--green);
}

.milestone-list > span.active i {
  background: var(--lime);
}

.milestone-list strong,
.milestone-list small {
  display: block;
}

.milestone-list strong {
  font-size: 14px;
}

.milestone-list small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.notification-list,
.organization-list {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.notification-list button,
.organization-list button {
  display: grid;
  width: 100%;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 14px;
  background: white;
  border: 1px solid var(--line-soft);
  border-radius: 11px;
  text-align: left;
}

.organization-list button {
  grid-template-columns: 42px minmax(0, 1fr) auto;
}

.organization-list button.active {
  background: var(--green-soft);
}

.notification-list > button > i {
  width: 9px;
  height: 9px;
  background: var(--green);
  border-radius: 50%;
}

.notification-list > button > i.red {
  background: var(--red);
}

.notification-list > button > i.amber {
  background: var(--amber);
}

.notification-list strong,
.notification-list small,
.organization-list strong,
.organization-list small {
  display: block;
}

.notification-list strong,
.organization-list strong {
  font-size: 14px;
}

.notification-list small,
.organization-list small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.notification-list em,
.organization-list em {
  color: var(--green);
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
}

.template-library {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.template-library article {
  padding: 17px;
  background: white;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
}

.template-library span,
.template-library strong,
.template-library small,
.template-library em {
  display: block;
}

.template-library span {
  color: var(--green);
  font-size: 13px;
  font-weight: 800;
}

.template-library strong {
  margin: 8px 0;
  font-size: 15px;
}

.template-library small,
.template-library em {
  color: var(--muted);
  font-size: 13px;
}

.template-library em {
  margin-top: 12px;
  color: var(--green-2);
  font-style: normal;
}

.compare-table-wrap {
  overflow-x: auto;
  background: white;
  border-radius: 11px;
}

.industry-detail-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.industry-detail-list > span {
  display: grid;
  grid-template-columns: 30px 155px minmax(0, 1fr) 50px 80px;
  align-items: center;
  gap: 9px;
  padding: 12px 13px;
  background: white;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
}

.industry-detail-list b,
.industry-detail-list small {
  color: var(--green);
  font-size: 13px;
}

.industry-detail-list strong {
  font-size: 14px;
}

.industry-detail-list > span > i {
  height: 8px;
  overflow: hidden;
  background: #edf1ee;
  border-radius: 5px;
}

.industry-detail-list > span > i em {
  display: block;
  height: 100%;
  background: var(--green);
}

.industry-detail-list > span > em {
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}

.inline-empty-state {
  display: grid;
  min-height: 160px;
  place-items: center;
  align-content: center;
  gap: 6px;
  color: var(--muted);
  text-align: center;
}

.inline-empty-state strong {
  color: var(--ink);
  font-size: 15px;
}

.inline-empty-state small {
  font-size: 13px;
}

/* 产品导览 */
.product-tour-backdrop {
  position: fixed;
  z-index: 155;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(7, 24, 17, 0.66);
  backdrop-filter: blur(8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
}

.product-tour-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

.product-tour-modal {
  position: relative;
  width: min(900px, 100%);
  max-height: calc(100vh - 48px);
  padding: 34px;
  overflow-y: auto;
  background: radial-gradient(circle at 94% 2%, rgba(198, 230, 111, 0.22), transparent 27%), white;
  border-radius: 22px;
  box-shadow: 0 28px 90px rgba(5, 25, 17, 0.28);
}

.product-tour-close {
  position: absolute;
  top: 18px;
  right: 18px;
}

.product-tour-hero {
  max-width: 690px;
}

.product-tour-hero > span {
  color: var(--green-2);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.product-tour-hero h2 {
  margin: 8px 0 10px;
  font-size: 34px;
}

.product-tour-hero p {
  margin: 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.75;
}

.tour-value-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 11px;
  margin-top: 24px;
}

.tour-value-grid article {
  padding: 17px;
  background: #f7faf7;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
}

.tour-value-grid i,
.tour-value-grid strong,
.tour-value-grid span {
  display: block;
}

.tour-value-grid i {
  color: var(--green);
  font-size: 13px;
  font-style: normal;
  font-weight: 800;
}

.tour-value-grid strong {
  margin: 8px 0 5px;
  font-size: 18px;
}

.tour-value-grid span {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
}

.tour-route {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-top: 22px;
  padding: 16px;
  color: #e7f2ec;
  background: #143d31;
  border-radius: 13px;
}

.tour-route span {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 14px;
  font-weight: 700;
}

.tour-route span b {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  color: #173c30;
  background: var(--lime);
  border-radius: 7px;
  font-size: 13px;
}

.tour-route > i {
  width: 28px;
  height: 1px;
  background: #6b887d;
}

.product-tour-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  margin-top: 22px;
}

.product-tour-modal > small {
  display: block;
  margin-top: 14px;
  color: var(--muted);
  font-size: 13px;
  text-align: right;
}

.product-tour-coach {
  position: fixed;
  z-index: 150;
  right: 26px;
  bottom: 26px;
  width: min(390px, calc(100vw - 32px));
  padding: 20px;
  color: white;
  background: linear-gradient(145deg, #163f32, #0f2e25);
  border: 1px solid rgba(198, 230, 111, 0.2);
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(6, 25, 17, 0.28);
}

.tour-coach-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.tour-coach-head > span {
  color: var(--lime);
  font-size: 13px;
  font-weight: 800;
}

.tour-coach-head button {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  color: #a8beb5;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 8px;
}

.tour-coach-head svg {
  width: 14px;
  height: 14px;
}

.product-tour-coach > strong {
  display: block;
  margin-top: 10px;
  font-size: 19px;
}

.product-tour-coach > p {
  margin: 7px 0 15px;
  color: #abc0b8;
  font-size: 14px;
  line-height: 1.7;
}

.tour-coach-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.tour-coach-actions button {
  padding: 8px 12px;
  color: #163d31;
  background: var(--lime);
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
}

.tour-coach-actions button:first-child {
  color: #dce9e3;
  background: rgba(255, 255, 255, 0.09);
}

.tour-target {
  position: relative;
  z-index: 145;
  outline: 4px solid var(--lime);
  outline-offset: 5px;
  box-shadow: 0 0 0 9999px rgba(7, 25, 17, 0.38), var(--shadow-high) !important;
}

/* 展示大屏 */
.showcase-screen {
  position: fixed;
  z-index: 180;
  inset: 0;
  min-width: 960px;
  overflow: auto;
  color: #e8f2ed;
  background: radial-gradient(circle at 82% 8%, rgba(198, 230, 111, 0.1), transparent 30%), linear-gradient(155deg, #0e2b23, #071d18 72%);
  opacity: 0;
  pointer-events: none;
  transform: scale(1.01);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.showcase-screen.open {
  opacity: 1;
  pointer-events: auto;
  transform: scale(1);
}

.showcase-header {
  display: flex;
  height: 86px;
  align-items: center;
  justify-content: space-between;
  padding: 0 34px;
  background: rgba(255, 255, 255, 0.025);
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.showcase-brand,
.showcase-brand > span:last-child {
  display: flex;
  align-items: center;
}

.showcase-brand {
  gap: 14px;
}

.showcase-brand > span:last-child {
  align-items: flex-start;
  flex-direction: column;
}

.showcase-brand strong {
  color: white;
  font-size: 20px;
}

.showcase-brand small {
  margin-top: 4px;
  color: #78968a;
  font-size: 13px;
}

.showcase-brand-mark {
  position: relative;
  width: 40px;
  height: 40px;
}

.showcase-brand-mark i {
  position: absolute;
  width: 24px;
  height: 9px;
  background: var(--lime);
  border-radius: 3px 9px 3px 9px;
  transform: skewX(-12deg);
}

.showcase-brand-mark i:nth-child(1) {
  top: 3px;
}

.showcase-brand-mark i:nth-child(2) {
  top: 15px;
  left: 7px;
  opacity: 0.75;
}

.showcase-brand-mark i:nth-child(3) {
  top: 27px;
  left: 14px;
  opacity: 0.5;
}

.showcase-header-actions {
  display: flex;
  align-items: center;
  gap: 16px;
}

.showcase-header-actions > span {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #8eaaa0;
  font-size: 13px;
}

.showcase-header-actions > span i {
  width: 8px;
  height: 8px;
  background: var(--lime);
  border-radius: 50%;
}

.showcase-header-actions button {
  color: #bad0c6;
  background: rgba(255, 255, 255, 0.06);
}

.showcase-content {
  min-height: calc(100vh - 86px);
  padding: 26px 34px 22px;
}

.showcase-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 35px;
}

.showcase-title > div:first-child > span {
  color: var(--lime);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.15em;
}

.showcase-title h2 {
  margin: 7px 0 4px;
  color: white;
  font-size: clamp(26px, 2.5vw, 38px);
}

.showcase-title p {
  margin: 0;
  color: #769387;
  font-size: 14px;
}

.showcase-score {
  display: grid;
  min-width: 225px;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0 13px;
  padding: 16px 20px;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid rgba(198, 230, 111, 0.15);
  border-radius: 14px;
}

.showcase-score strong {
  grid-row: 1 / 3;
  color: var(--lime);
  font-size: 43px;
}

.showcase-score span {
  color: white;
  font-size: 14px;
  font-weight: 700;
}

.showcase-score em {
  color: #7fc39f;
  font-size: 13px;
  font-style: normal;
}

.showcase-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 20px;
}

.showcase-metrics article,
.showcase-panel {
  padding: 16px 18px;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
}

.showcase-metrics span,
.showcase-metrics strong,
.showcase-metrics em {
  display: block;
}

.showcase-metrics span,
.showcase-metrics em {
  color: #89a69a;
  font-size: 13px;
}

.showcase-metrics strong {
  margin: 5px 0 2px;
  color: white;
  font-size: 27px;
}

.showcase-metrics strong small {
  margin-left: 4px;
  color: #8ba69b;
  font-size: 13px;
}

.showcase-metrics em {
  color: #7fc39f;
  font-style: normal;
}

.showcase-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 12px;
  margin-top: 12px;
}

.showcase-panel {
  min-width: 0;
  padding: 18px;
}

.showcase-focus {
  grid-column: 1 / -1;
}

.showcase-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
}

.showcase-panel-head span {
  color: white;
  font-size: 16px;
  font-weight: 700;
}

.showcase-panel-head strong {
  color: #617e72;
  font-size: 13px;
}

.showcase-rank-list,
.showcase-focus-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.showcase-rank-list > span {
  display: grid;
  grid-template-columns: 32px 150px minmax(0, 1fr) 43px;
  align-items: center;
  gap: 10px;
}

.showcase-rank-list b,
.showcase-rank-list small {
  color: var(--lime);
  font-size: 13px;
}

.showcase-rank-list strong {
  font-size: 14px;
}

.showcase-rank-list > span > i {
  height: 9px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 5px;
}

.showcase-rank-list > span > i em {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--lime), #69bc92);
}

.showcase-growth-chart {
  display: flex;
  min-height: 220px;
  align-items: flex-end;
  justify-content: space-around;
  gap: 9px;
}

.showcase-growth-chart > span {
  display: flex;
  min-width: 0;
  flex: 1;
  align-items: center;
  flex-direction: column;
}

.showcase-growth-chart > span::before {
  width: min(55px, 80%);
  height: calc(var(--value) * 1.7px);
  max-height: 165px;
  background: linear-gradient(180deg, var(--lime), #1f7a58);
  border-radius: 9px 9px 2px 2px;
  content: "";
}

.showcase-growth-chart i,
.showcase-growth-chart b {
  margin-top: 7px;
  color: #91ada1;
  font-size: 13px;
  font-style: normal;
  text-align: center;
}

.showcase-growth-chart b {
  margin-top: 2px;
  color: var(--lime);
}

.showcase-focus-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.showcase-focus-list > span {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 3px 10px;
  padding: 13px;
  background: rgba(255, 255, 255, 0.035);
  border-radius: 9px;
}

.showcase-focus-list b {
  display: grid;
  width: 34px;
  height: 34px;
  grid-row: 1 / 3;
  place-items: center;
  color: #173a2e;
  background: var(--lime);
  border-radius: 8px;
  font-size: 13px;
}

.showcase-focus-list strong {
  color: white;
  font-size: 14px;
}

.showcase-focus-list small {
  color: #7f9b90;
  font-size: 13px;
}

.showcase-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
  color: #668278;
  font-size: 13px;
}

.showcase-footer strong {
  color: #9bb7ab;
  font-size: 13px;
}

/* 统一可读性：企业展示不使用小于13px的业务文字 */
body small,
body button,
body input,
body select,
body textarea {
  font-size: 13px !important;
}

.app-shell .eyebrow {
  font-size: 13px !important;
}

.app-shell .main-content span,
.app-shell .main-content em {
  font-size: 13px !important;
}

.app-shell .main-content .panel-kicker,
.app-shell .main-content .match-summary strong,
.app-shell .main-content .skill-gap strong,
.app-shell .main-content .project-progress strong,
.app-shell .main-content .health-score strong,
.app-shell .main-content .action-health strong,
.app-shell .main-content .lineage-flow span,
.app-shell .main-content .issue-list strong {
  font-size: 13px !important;
}

.app-shell .main-content .profile-banner span,
.app-shell .main-content .report-stat-grid span,
.app-shell .main-content .report-stat-grid em,
.app-shell .main-content .recommendation-evidence,
.app-shell .main-content #reportListSummary {
  font-size: 14px !important;
}

.app-shell .school-card strong,
.app-shell .role-avatar,
.app-shell .notification-button > span {
  font-size: 13px !important;
}

.app-shell .notification-button > span {
  width: 20px;
  height: 20px;
}

.brand small,
.nav-label,
.school-card span,
.sync-line,
.meeting-pack small,
.meeting-pack strong,
.nav-count,
.breadcrumb,
.role-copy small,
.edition-badge,
.quality-main strong,
.quality-main span,
.metric-label,
.metric-foot,
.metric-tag,
.chart-legend,
.chart-labels,
.panel-kicker,
.status-badge,
.gap-badge,
.source-summary-foot,
.source-summary-metrics,
.source-filter-result,
.source-category-badge,
.source-commercial-badge,
.source-status,
.source-license-grid span,
.source-card-meta span,
.source-card-foot span,
.report-featured-label,
.report-type-badge,
.featured-report-meta,
.featured-report-cover small,
.featured-report-cover span,
.report-list-meta,
.report-list-side em,
.modal-kicker,
.modal small,
.toast small,
.tooltip {
  font-size: 13px !important;
}

.toast strong {
  font-size: 14px !important;
}

.toast small {
  color: #c2d3cb;
  line-height: 1.55;
}

.main-content small,
.main-content .data-table th,
.main-content .data-table td,
.main-content .priority-mark,
.main-content .owner-avatar,
.main-content .partner-avatar,
.main-content .task-progress-cell span,
.modal label > span,
.modal button,
.modal input,
.modal select,
.modal textarea {
  font-size: 13px !important;
}

.recommendation-copy strong {
  font-size: 15px !important;
}

.recommendation-evidence {
  font-size: 14px !important;
}

.report-reader small,
.report-reader .report-toc-label,
.report-reader .report-toc button,
.report-reader .report-reader-meta span,
.report-reader .report-reader-meta strong,
.report-reader .report-standard-stamp,
.report-reader .report-cover-foot span,
.report-reader .report-section-heading small,
.report-reader .report-metric-grid span,
.report-reader .report-metric-grid small,
.report-reader .report-source-tag,
.report-reader .report-confidence,
.report-reader .report-action-priority,
.report-reader .report-action-card button,
.report-reader .report-evidence-code,
.report-reader .report-profile-code,
.report-reader .report-profile-label,
.report-reader .report-proof-chain small,
.report-reader .report-method-steps p,
.report-reader .report-action-cycle small {
  font-size: 13px !important;
}

.report-reader .report-finding small,
.report-reader .report-action-card small,
.report-reader .report-chart-card figcaption,
.report-reader .report-interpretation p,
.report-reader .report-table td {
  font-size: 14px !important;
}

.report-reader .report-table th {
  font-size: 13px !important;
}

.report-reader .reader-version,
.report-reader .report-document summary,
.report-reader .report-document .report-chart-head > span,
.report-reader .report-document .report-profile-kicker,
.report-reader .report-document .report-profile-attributes strong,
.report-reader .report-document .report-profile-stat-grid article > em,
.report-reader .report-document .report-profile-stat-grid details strong,
.report-reader .report-document .report-benchmark-strip em,
.report-reader .report-document .report-interpretation > span,
.report-reader .report-document .report-finding-validation strong,
.report-reader .report-document .report-finding-validation span,
.report-reader .report-document .report-finding-validation i,
.report-reader .report-document .report-proof-chain i,
.report-reader .report-document .report-proof-chain strong,
.report-reader .report-document .report-method-steps article > span,
.report-reader .report-document .report-method-steps strong,
.report-reader .report-document .report-action-cycle strong {
  font-size: 13px !important;
}

.report-reader .report-document .report-evidence-table td strong,
.report-reader .report-document .report-evidence-notice strong {
  font-size: 13px !important;
}

.report-reader .report-document svg text {
  font-size: 13px !important;
}

.report-reader .report-document p,
.report-reader .report-document li,
.report-reader .report-document .report-method-note,
.report-reader .report-document .report-evidence-notice p {
  font-size: 14px !important;
}

@media (max-width: 900px) {
  .tour-launch span {
    display: none;
  }

  .tour-launch {
    width: 40px;
    padding: 0;
    justify-content: center;
  }

  .profession-detail-grid,
  .data-ops-two-column,
  .template-library {
    grid-template-columns: 1fr;
  }

  .profession-detail-panel.wide {
    grid-column: auto;
  }

  .job-flow-board {
    grid-template-columns: 120px 65px minmax(260px, 1fr);
    overflow-x: auto;
  }

  .data-ops-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .data-requirement-steps {
    grid-template-columns: 1fr 1fr;
  }

  .tour-value-grid {
    grid-template-columns: 1fr;
  }

  .tour-route {
    align-items: stretch;
    flex-direction: column;
  }

  .tour-route > i {
    width: 1px;
    height: 13px;
    margin-left: 13px;
  }
}

@media (max-width: 680px) {
  .showcase-screen {
    width: 100vw;
    min-width: 0;
  }

  .showcase-header {
    min-height: 74px;
    height: auto;
    gap: 12px;
    padding: 12px 15px;
  }

  .showcase-brand {
    min-width: 0;
    gap: 9px;
  }

  .showcase-brand strong {
    font-size: 15px;
  }

  .showcase-brand small,
  .showcase-header-actions > span {
    display: none;
  }

  .showcase-content {
    min-height: calc(100vh - 74px);
    padding: 18px 14px 24px;
  }

  .showcase-title {
    align-items: stretch;
    flex-direction: column;
    gap: 15px;
  }

  .showcase-title h2 {
    font-size: 27px;
  }

  .showcase-score {
    width: 100%;
  }

  .showcase-metrics {
    grid-template-columns: 1fr 1fr;
  }

  .showcase-main-grid {
    grid-template-columns: 1fr;
  }

  .showcase-focus {
    grid-column: auto;
  }

  .showcase-rank-list > span {
    grid-template-columns: 25px 112px minmax(0, 1fr) 36px;
    gap: 7px;
  }

  .showcase-growth-chart {
    min-height: 200px;
  }

  .showcase-focus-list {
    grid-template-columns: 1fr;
  }

  .showcase-footer {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .data-ops-drawer,
  .workspace-detail-drawer {
    width: 100vw;
  }

  .data-ops-header,
  .workspace-detail-header {
    padding: 20px 18px 16px;
  }

  .data-ops-content,
  .workspace-detail-content {
    padding: 16px 15px 28px;
  }

  .data-ops-stat-grid,
  .batch-update-summary,
  .authorization-summary-grid,
  .workspace-metric-grid,
  .data-contract-hero,
  .data-authorization-card > div,
  .data-impact-grid,
  .security-control-grid,
  .workspace-evidence-list {
    grid-template-columns: 1fr 1fr;
  }

  .data-requirement-steps,
  .data-source-methods,
  .data-form-grid,
  .workspace-form-grid {
    grid-template-columns: 1fr;
  }

  .data-form-grid label.full,
  .workspace-form-grid label.full {
    grid-column: auto;
  }

  .data-wizard-progress {
    align-items: flex-start;
    flex-direction: column;
  }

  .data-wizard-progress > i {
    width: 1px;
    height: 10px;
    margin-left: 12px;
  }

  .profession-evidence-note {
    grid-template-columns: 1fr;
  }

  .profession-evidence-note > span,
  .profession-evidence-note button {
    justify-self: start;
  }

  .salary-comparison > span {
    grid-template-columns: 1fr 68px;
  }

  .salary-comparison > span > i {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .product-tour-backdrop {
    padding: 10px;
  }

  .product-tour-modal {
    padding: 28px 20px 22px;
  }

  .product-tour-hero h2 {
    font-size: 28px;
  }

  .product-tour-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .product-tour-actions .button {
    width: 100%;
  }

  .product-tour-coach {
    right: 16px;
    bottom: 16px;
  }

  .industry-detail-list > span {
    grid-template-columns: 28px 1fr 48px;
  }

  .industry-detail-list > span > i,
  .industry-detail-list > span > em {
    grid-column: 2 / -1;
  }
}

/* 校园业务闭环 */
.loop-identity-strip {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  margin-bottom: 16px;
  padding: 14px 16px;
  color: #dcebe4;
  background: linear-gradient(135deg, #173f33, #102e26);
  border-radius: 13px;
}

.loop-identity-strip > strong {
  color: var(--lime);
  font-size: 14px;
}

.loop-identity-strip > span {
  padding: 5px 8px;
  background: rgba(255, 255, 255, 0.07);
  border-radius: 6px;
  font-size: 13px;
}

.loop-identity-strip b {
  color: white;
}

.loop-identity-strip > small {
  width: 100%;
  color: #a7beb4;
  font-size: 13px;
}

.loop-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  align-items: start;
  gap: 16px;
}

.loop-main {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 16px;
}

.loop-action-panel {
  position: sticky;
  top: 86px;
  min-width: 0;
}

.loop-status-panel {
  margin-bottom: 16px;
  overflow: hidden;
  background:
    radial-gradient(circle at 96% 2%, rgba(198, 230, 111, 0.08), transparent 24%),
    white;
}

.loop-flow-toolbar {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 12px;
  margin: 18px 0 12px;
  padding: 10px;
  background: #f3f7f4;
  border: 1px solid #e1e9e3;
  border-radius: 11px;
}

.loop-flow-summary {
  display: grid;
  min-width: 0;
  flex: 1;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.loop-flow-summary > span {
  min-width: 0;
  padding: 9px 11px;
  background: white;
  border: 1px solid #e5ebe6;
  border-radius: 8px;
}

.loop-flow-summary small,
.loop-flow-summary strong {
  display: block;
}

.loop-flow-summary small {
  color: var(--muted);
}

.loop-flow-summary strong {
  margin-top: 4px;
  overflow: hidden;
  color: var(--ink);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.loop-flow-toolbar > .button {
  align-self: stretch;
  flex: 0 0 auto;
}

.loop-flow-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  background:
    linear-gradient(rgba(35, 107, 79, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(35, 107, 79, 0.045) 1px, transparent 1px),
    #f7f9f7;
  background-size: 25px 25px;
  border: 1px solid #dce5df;
  border-radius: 13px;
}

.loop-flow-canvas {
  --loop-canvas-width: 1000px;
  --loop-canvas-height: 600px;
  --loop-node-width: 170px;
  --loop-node-height: 130px;
  position: relative;
  width: var(--loop-canvas-width);
  min-width: var(--loop-canvas-width);
  height: var(--loop-canvas-height);
  margin: 0 auto;
}

.loop-flow-edges,
.loop-flow-nodes {
  position: absolute;
  inset: 0;
}

.loop-flow-edges {
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.loop-flow-edge path {
  fill: none;
  stroke: #bdc9c2;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.loop-flow-edge text {
  fill: #77867e;
  stroke: #f7f9f7;
  stroke-width: 5px;
  paint-order: stroke;
  font-size: 13px;
  font-weight: 700;
}

.loop-flow-edge.complete path {
  stroke: var(--green);
}

.loop-flow-edge.current path {
  stroke: #d69a31;
  stroke-dasharray: 7 5;
}

.loop-flow-edge.risk path {
  stroke: #c76656;
  stroke-dasharray: 6 4;
}

.loop-flow-edge.branch path {
  stroke: #96a69d;
  stroke-dasharray: 5 5;
}

#loop-arrow-complete path {
  fill: var(--green);
}

#loop-arrow-current path {
  fill: #d69a31;
}

#loop-arrow-risk path {
  fill: #c76656;
}

#loop-arrow-locked path,
#loop-arrow-branch path {
  fill: #96a69d;
}

.loop-flow-node {
  position: absolute;
  left: var(--loop-x);
  top: var(--loop-y);
  z-index: 2;
  display: grid;
  width: var(--loop-node-width);
  height: var(--loop-node-height);
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 8px;
  padding: 11px;
  color: var(--ink);
  background: white;
  border: 1px solid #dfe7e1;
  border-radius: 11px;
  box-shadow: 0 7px 20px rgba(24, 61, 46, 0.07);
  text-align: left;
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.loop-flow-node:hover,
.loop-flow-node:focus-visible {
  z-index: 3;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(24, 61, 46, 0.14);
}

.loop-flow-node.selected {
  z-index: 3;
  outline: 3px solid rgba(35, 135, 101, 0.16);
  outline-offset: 2px;
}

.loop-flow-node.complete {
  background: #f2f8f5;
  border-color: #a9d0ba;
}

.loop-flow-node.complete.has-risk {
  background: #fff8f5;
  border-color: #d9a293;
  box-shadow: inset 0 3px #c76656;
}

.loop-flow-node.current {
  background: #fffaf0;
  border-color: #ddac55;
  box-shadow: 0 9px 25px rgba(181, 124, 27, 0.16);
}

.loop-flow-node.risk {
  background: #fff5f2;
  border-color: #db9b8c;
  box-shadow: 0 9px 25px rgba(173, 78, 69, 0.13);
}

.loop-flow-node.locked {
  color: #66736c;
  background: #f6f8f6;
  border-style: dashed;
  box-shadow: none;
}

.loop-flow-node.locked.has-risk {
  background: #fff8f5;
  border-color: #d9a293;
}

.loop-flow-node-step {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  color: #6f7e76;
  background: #e9eeeb;
  border-radius: 9px;
  font-weight: 800;
}

.loop-flow-node.complete .loop-flow-node-step {
  color: white;
  background: var(--green);
}

.loop-flow-node.complete.has-risk .loop-flow-node-step {
  background: #b95b4d;
}

.loop-flow-node.current .loop-flow-node-step {
  color: #825813;
  background: #ffecc5;
}

.loop-flow-node.risk .loop-flow-node-step {
  color: #a34e42;
  background: #ffe3dc;
}

.loop-flow-node-copy {
  min-width: 0;
}

.loop-flow-node-copy small,
.loop-flow-node-copy strong,
.loop-flow-node-copy em {
  display: block;
  min-width: 0;
}

.loop-flow-node-copy small {
  color: var(--muted);
}

.loop-flow-node-copy strong {
  margin: 4px 0;
  font-size: 14px;
  line-height: 1.35;
}

.loop-flow-node-copy em {
  overflow: hidden;
  color: var(--green);
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.loop-flow-node.current .loop-flow-node-copy em {
  color: #9b6817;
}

.loop-flow-node.complete.has-risk .loop-flow-node-copy em,
.loop-flow-node.risk .loop-flow-node-copy em {
  color: #a34e42;
}

.loop-flow-node.locked .loop-flow-node-copy em {
  color: #88948e;
}

.loop-flow-node-owner {
  grid-column: 1 / -1;
  margin-top: 4px;
  padding-top: 7px;
  overflow: hidden;
  color: var(--muted);
  border-top: 1px solid rgba(94, 113, 103, 0.14);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.loop-flow-legend {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 11px;
  color: var(--muted);
}

.loop-mobile-branches {
  display: none;
}

.loop-flow-legend > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.loop-flow-legend i {
  width: 11px;
  height: 11px;
  background: #f4f6f4;
  border: 2px dashed #aebbb4;
  border-radius: 3px;
}

.loop-flow-legend i.complete {
  background: var(--green);
  border-color: var(--green);
  border-style: solid;
}

.loop-flow-legend i.current {
  background: #fff2d5;
  border-color: #d59a31;
  border-style: solid;
}

.loop-flow-legend i.risk {
  background: #ffe5df;
  border-color: #c76656;
  border-style: solid;
}

.loop-node-detail {
  display: grid;
  gap: 12px;
}

.loop-node-hero {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  align-items: start;
  gap: 13px;
  padding: 16px;
  color: #dcebe4;
  background:
    radial-gradient(circle at 92% 10%, rgba(198, 230, 111, 0.14), transparent 26%),
    linear-gradient(135deg, #173f33, #102e26);
  border-radius: 12px;
}

.loop-node-hero.current {
  background:
    radial-gradient(circle at 92% 10%, rgba(255, 228, 167, 0.18), transparent 26%),
    linear-gradient(135deg, #4b3819, #2e281d);
}

.loop-node-hero.risk {
  background:
    radial-gradient(circle at 92% 10%, rgba(255, 213, 202, 0.16), transparent 26%),
    linear-gradient(135deg, #543128, #33231f);
}

.loop-node-hero.locked {
  color: #d7dfda;
  background: linear-gradient(135deg, #45534c, #303a35);
}

.loop-node-hero-step {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  color: #173f33;
  background: var(--lime);
  border-radius: 12px;
  font-size: 17px;
  font-weight: 900;
}

.loop-node-hero small,
.loop-node-hero strong {
  display: block;
}

.loop-node-hero small {
  color: #9db3aa;
}

.loop-node-hero strong {
  margin-top: 5px;
  color: white;
  font-size: 15px;
}

.loop-node-hero p {
  margin: 7px 0 0;
  color: #a8bdb4;
  line-height: 1.65;
}

.loop-node-hero > em {
  padding: 6px 8px;
  color: var(--lime);
  background: rgba(255, 255, 255, 0.08);
  border-radius: 7px;
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}

.loop-node-io {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1fr);
  align-items: stretch;
  gap: 8px;
}

.loop-node-io article {
  padding: 12px;
  background: #f7faf8;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
}

.loop-node-io span,
.loop-node-io strong {
  display: block;
}

.loop-node-io span {
  color: var(--muted);
}

.loop-node-io strong {
  margin-top: 6px;
  line-height: 1.5;
}

.loop-node-io > i {
  display: grid;
  place-items: center;
  color: #91a49a;
}

.loop-node-io svg {
  width: 18px;
  height: 18px;
}

.loop-node-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.loop-node-facts > span {
  min-width: 0;
  padding: 11px;
  background: white;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
}

.loop-node-facts small,
.loop-node-facts strong {
  display: block;
  overflow-wrap: anywhere;
}

.loop-node-facts small {
  color: var(--muted);
}

.loop-node-facts strong {
  margin-top: 5px;
  line-height: 1.5;
}

.loop-node-relations {
  padding: 12px;
  background: #f6f8f6;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
}

.loop-node-relations > span {
  display: block;
  margin-bottom: 7px;
  color: var(--muted);
  font-weight: 700;
}

.loop-node-relations > div {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.loop-node-relations button {
  max-width: 100%;
  padding: 6px 8px;
  overflow: hidden;
  color: var(--green);
  background: white;
  border: 1px solid #cfdfd6;
  border-radius: 6px;
  font-family: "SFMono-Regular", Consolas, monospace;
  text-overflow: ellipsis;
}

.loop-node-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  background: #edf7f1;
  border: 1px solid #d2e6da;
  border-radius: 9px;
}

.loop-node-action.locked,
.loop-node-action.readonly {
  background: #f6f8f6;
  border-color: var(--line-soft);
}

.loop-node-action span,
.loop-node-action strong,
.loop-node-action small {
  display: block;
}

.loop-node-action small {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.5;
}

.loop-role-boundary {
  margin-bottom: 12px;
  padding: 13px;
  color: #6e5423;
  background: #fff9ec;
  border: 1px solid #eee0bd;
  border-radius: 10px;
}

.loop-role-boundary strong,
.loop-role-boundary p {
  font-size: 13px;
}

.loop-role-boundary p {
  margin: 5px 0 0;
  line-height: 1.6;
}

.loop-action-list {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.loop-action-list > button {
  display: grid;
  width: 100%;
  min-width: 0;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  padding: 11px;
  color: var(--ink);
  background: white;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  text-align: left;
}

.loop-action-list > button:not(:disabled):hover {
  background: #f3f9f6;
  border-color: #a9cfbb;
}

.loop-action-list button:disabled {
  opacity: 0.58;
  cursor: not-allowed;
}

.loop-action-list > button > i {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  color: var(--green);
  background: var(--green-soft);
  border-radius: 8px;
  font-style: normal;
  font-weight: 800;
}

.loop-action-list span,
.loop-action-list strong,
.loop-action-list small,
.loop-action-list em {
  display: block;
  min-width: 0;
}

.loop-action-list strong {
  margin-top: 3px;
  font-size: 14px;
}

.loop-action-list small {
  color: var(--muted);
}

.loop-action-list em {
  margin-top: 4px;
  overflow: hidden;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.loop-action-list b {
  flex: 0 0 auto;
  color: var(--green);
  font-size: 13px;
  font-weight: 800;
}

.loop-audit-list,
.report-approval-toolbar details > div {
  display: flex;
  max-height: 430px;
  overflow-y: auto;
  flex-direction: column;
}

.loop-audit-list > span {
  display: grid;
  grid-template-columns: 12px 1fr;
  gap: 3px 9px;
  padding: 11px 0;
  border-bottom: 1px solid var(--line-soft);
}

.loop-audit-list i {
  width: 8px;
  height: 8px;
  grid-row: 1 / 4;
  margin-top: 5px;
  background: var(--green);
  border-radius: 50%;
}

.loop-audit-list strong,
.loop-audit-list small,
.loop-audit-list em {
  font-size: 13px;
}

.loop-audit-list small {
  color: var(--muted);
}

.loop-audit-list em {
  color: var(--green-2);
  font-style: normal;
}

.loop-modal {
  width: min(680px, calc(100vw - 24px));
  max-height: calc(100vh - 36px);
  overflow-y: auto;
}

.loop-modal-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 18px;
}

.loop-modal-fields label {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 6px;
}

.loop-modal-fields label:has(textarea) {
  grid-column: 1 / -1;
}

.loop-modal-fields span,
.loop-modal-fields input,
.loop-modal-fields select,
.loop-modal-fields textarea {
  font-size: 13px;
}

.loop-modal-fields input,
.loop-modal-fields select,
.loop-modal-fields textarea {
  width: 100%;
  padding: 10px 11px;
  color: var(--ink);
  background: white;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.loop-linked-id {
  display: block;
  margin: 5px 0;
  color: var(--green-2);
  font-size: 13px;
  overflow-wrap: anywhere;
}

.loop-inline-action {
  margin-top: 13px;
}

.loop-inline-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 13px;
}

.report-approval-toolbar {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 54px;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 9px 22px;
  background: #f8faf8;
  border-bottom: 1px solid var(--line);
}

.report-approval-toolbar > span strong,
.report-approval-toolbar > span small {
  display: block;
  font-size: 13px;
}

.report-flow-state.draft strong {
  color: #9a651b;
}

.report-flow-state.official strong {
  color: var(--green);
}

.report-approval-toolbar small,
.report-link-summary {
  color: var(--muted);
  font-size: 13px;
}

.report-approval-toolbar details {
  position: relative;
  font-size: 13px;
}

.report-approval-toolbar details > div {
  position: absolute;
  z-index: 3;
  top: 28px;
  right: 0;
  width: min(420px, calc(100vw - 28px));
  max-height: 280px;
  padding: 10px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow-high);
}

.report-approval-toolbar details span {
  display: block;
  padding: 8px;
  border-bottom: 1px solid var(--line-soft);
}

.report-approval-toolbar details strong,
.report-approval-toolbar details small,
.report-approval-toolbar details em {
  display: block;
  font-size: 13px;
}

.report-approval-toolbar details em {
  color: var(--muted);
  font-style: normal;
}

.report-flow-actions {
  display: flex;
  gap: 8px;
  margin-left: auto;
}

@media (max-width: 1050px) {
  .loop-layout {
    grid-template-columns: 1fr;
  }

  .loop-action-panel {
    position: static;
  }

  .loop-flow-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .loop-modal-fields {
    grid-template-columns: 1fr;
  }

  .loop-modal-fields label:has(textarea) {
    grid-column: auto;
  }

  .loop-identity-strip {
    align-items: stretch;
    flex-direction: column;
  }

  .loop-flow-toolbar {
    flex-direction: column;
  }

  .loop-flow-summary {
    grid-template-columns: 1fr 1fr;
  }

  .loop-flow-toolbar > .button {
    width: 100%;
  }

  .loop-flow-scroll {
    overflow: visible;
  }

  .loop-flow-canvas {
    width: 100%;
    min-width: 0;
    height: auto;
    padding: 12px;
  }

  .loop-flow-edges {
    display: none;
  }

  .loop-flow-nodes {
    position: static;
    display: grid;
    gap: 13px;
  }

  .loop-flow-node {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    height: auto;
    min-height: 0;
  }

  .loop-flow-node:not(:last-child)::after {
    position: absolute;
    z-index: 1;
    bottom: -14px;
    left: 28px;
    width: 2px;
    height: 14px;
    background: #9fb1a7;
    content: "";
  }

  .loop-flow-legend {
    gap: 8px 12px;
  }

  .loop-mobile-branches {
    display: grid;
    gap: 7px;
    margin-top: 10px;
  }

  .loop-mobile-branches button {
    display: grid;
    position: relative;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 8px;
    padding: 10px;
    color: var(--ink);
    background: #f7f9f7;
    border: 1px dashed #b9c6bf;
    border-radius: 8px;
    text-align: left;
  }

  .loop-mobile-branches button.active.risk {
    background: #fff4f1;
    border-color: #cf7969;
    border-style: solid;
  }

  .loop-mobile-branches button.active.cycle {
    background: #fff9ec;
    border-color: #d9a44a;
    border-style: solid;
  }

  .loop-mobile-branches span {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 6px;
  }

  .loop-mobile-branches i,
  .loop-mobile-branches em {
    font-style: normal;
  }

  .loop-mobile-branches i {
    color: #8c9992;
  }

  .loop-mobile-branches small {
    grid-column: 1 / -1;
    color: var(--muted);
    line-height: 1.45;
  }

  .loop-mobile-branches em {
    align-self: start;
    color: var(--muted);
    font-weight: 800;
    white-space: nowrap;
  }

  .loop-mobile-branches button.active.risk em {
    color: #ad4e45;
  }

  .loop-mobile-branches button.active.cycle em {
    color: #956313;
  }

  .loop-node-hero {
    grid-template-columns: 44px minmax(0, 1fr);
    padding: 13px;
  }

  .loop-node-hero-step {
    width: 42px;
    height: 42px;
    border-radius: 10px;
  }

  .loop-node-hero > em {
    grid-column: 2;
    justify-self: start;
  }

  .loop-node-io {
    grid-template-columns: 1fr;
  }

  .loop-node-io > i {
    height: 14px;
    transform: rotate(90deg);
  }

  .loop-node-facts {
    grid-template-columns: 1fr;
  }

  .loop-node-action {
    align-items: stretch;
    flex-direction: column;
  }

  .loop-node-action .button {
    width: 100%;
  }

  .report-approval-toolbar {
    align-items: stretch;
    flex-direction: column;
    padding: 9px 14px;
  }

  .report-flow-actions {
    width: 100%;
    margin-left: 0;
  }

  .report-flow-actions .button {
    flex: 1;
  }
}

@media print {
  body > .app-shell,
  body > .toast-region,
  body > .product-tour-backdrop,
  body > .product-tour-coach,
  body > .data-ops-backdrop,
  body > .workspace-detail-backdrop,
  body > .showcase-screen {
    display: none !important;
  }

  .report-reader {
    position: static;
    display: block;
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }

  .report-reader-header,
  .report-toc,
  .report-flow-actions {
    display: none;
  }

  .report-approval-toolbar {
    display: block;
    padding: 8px;
  }

  .report-reader-layout,
  .report-document-wrap {
    display: block;
    overflow: visible;
  }

  .report-document {
    width: 100%;
    margin: 0;
    box-shadow: none;
  }
}