/* Optional project detail; retains the validated walkthrough presentation. */
.workflow-page #example-project {
  padding-top: clamp(28px, 4vw, 56px);
}
.workflow-page #example-project .workflow-breadcrumb {
  display: inline-block;
  margin: 0 0 22px;
  color: var(--ex-muted);
  font-size: 0.8125rem;
}
.workflow-page #example-project h1 {
  max-width: 760px;
  margin: 0;
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.04em;
}
.workflow-page #example-project .workflow-plan-hint {
  display: none;
}
.workflow-page #example-project .ex-stage-heading h2 {
  max-width: 23ch;
  font-size: clamp(1.75rem, 3.6vw, 3.15rem);
  line-height: 1.12;
  letter-spacing: -0.04em;
}
.workflow-page #example-project .ex-step-count {
  font-size: 0.9375rem;
}
.workflow-page #example-project .ex-form {
  max-height: min(58svh, 440px);
}
.workflow-page #example-project .ex-detail-disclosure {
  margin-top: 22px;
  border-block: 1px solid var(--ex-line);
}
.workflow-page #example-project .ex-detail-disclosure > summary {
  min-height: 56px;
  padding: 16px 6px;
  color: var(--ex-ink);
  font-size: 0.9375rem;
  line-height: 1.5;
  cursor: pointer;
}
.workflow-page #example-project .ex-detail-disclosure > summary:hover {
  color: var(--ex-green);
}
.workflow-page #example-project .ex-detail-disclosure > summary:focus-visible {
  outline: 3px solid #a66231;
  outline-offset: 3px;
}
.workflow-page #example-project .ex-detail-disclosure[open] > summary {
  border-bottom: 1px solid var(--ex-line);
}
.workflow-page #example-project .ex-detail-disclosure .ex-field-inventory {
  margin-top: 0;
  padding-top: 18px;
  border: 0;
}
.workflow-page #example-project .ex-detail-note {
  margin: 14px 0 20px;
  color: var(--ex-muted);
  font-size: 0.8125rem;
}
.workflow-page #example-project .ex-disclosure-hint {
  display: block;
  margin-left: 18px;
  color: var(--ex-muted);
  font-size: 0.8125rem;
}
.workflow-page #example-project .ex-lab-proposal .ex-detail-disclosure {
  margin-top: 0;
}
.workflow-page #example-project :is(#example-coc, #example-report) {
  --ex-muted: #cad9ce;
  --ex-line: #567366;
  color: #f4f7ef;
  background: #090d0e;
}
.workflow-page
  #example-project
  :is(#example-coc, #example-report)
  .ex-doc-viewer,
.workflow-page
  #example-project
  :is(#example-coc, #example-report)
  .ex-document {
  --ex-muted: #52645e;
  --ex-line: #cbd2c9;
  color: #172e2b;
}
.workflow-page #example-project #example-report > .ex-review-status {
  color: #e6dfba;
  border-color: #c9b881;
}
.workflow-page
  #example-project
  :is(#example-coc, #example-report)
  .ex-stage-footer
  .ex-action {
  border-color: #edf8f8;
  background: #edf8f8;
  color: #0a2e30;
}
.workflow-page
  #example-project
  :is(#example-coc, #example-report)
  .ex-stage-footer
  .ex-action:hover {
  background: #dce8db;
}
.workflow-page
  #example-project
  :is(#example-coc, #example-report)
  .ex-stage-footer
  .ex-action:focus-visible {
  outline-color: #e3bb80;
}
@media (min-width: 1100px) {
  .workflow-page
    #example-project[data-documents-enhanced="true"]
    .ex-lab-compare {
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  }
  .workflow-page
    #example-project[data-documents-enhanced="true"]
    .ex-lab-source {
    border-right: 1px solid var(--ex-line);
    border-bottom: 0;
  }
}
@media (max-width: 760px) {
  .workflow-page #example-project .workflow-plan-hint {
    display: block;
    margin: -4px 0 14px;
    color: var(--ex-muted);
    font-size: 0.8125rem;
    line-height: 1.5;
  }
}
