/* Keep the seven-stage process, focus the surface on the current responsibility. */
.wf-nav-more { margin-top: 22px; }
.wf-nav-more > summary { padding: 10px 12px; color: var(--text-secondary); font-size: 12px; cursor: pointer; }
.wf-inbox .card-header > div > p { margin-top: 5px; }
.wf-total { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; margin-left: 8px; padding: 0 7px; border-radius: 6px; color: var(--brand); background: var(--brand-light); font-size: 14px; }
.wf-inbox-filters { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 24px 16px; border-bottom: 1px solid var(--border); }
.wf-inbox-filters .btn { gap: 8px; }
.wf-inbox-filters .btn span { opacity: .75; font-variant-numeric: tabular-nums; }
.wf-inbox-list { padding: 0 24px; }
.wf-inbox-row { display: flex; align-items: center; gap: 16px; min-width: 0; padding: 20px 0; border-bottom: 1px solid var(--border); }
.wf-inbox-row:last-child { border-bottom: 0; }
.wf-inbox-icon { display: grid; place-items: center; flex: 0 0 36px; height: 36px; border-radius: 10px; background: var(--surface-muted); }
.wf-inbox-copy { flex: 1; min-width: 0; }
.wf-inbox-copy > div { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.wf-inbox-copy h3 { font-size: 14px; line-height: 22px; overflow-wrap: anywhere; }
.wf-inbox-copy p { margin-top: 5px; color: var(--text-secondary); font-size: 12px; }
.wf-category { color: var(--text-secondary); font-size: 12px; }
.wf-resume { margin-top: 28px; }
.wf-project-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.wf-resume-card { text-align: left; padding: 22px; display: flex; flex-direction: column; gap: 14px; width: 100%; }
.wf-resume-card:hover { border-color: var(--border-strong); }
.wf-resume-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.wf-resume-card h3 { font-size: 16px; }
.wf-resume-card p { color: var(--text-secondary); font-size: 13px; }
.wf-resume-footer { display: flex; align-items: center; justify-content: space-between; color: var(--brand); font-size: 12px; padding-top: 4px; }
.wf-analytics { margin-top: 26px; }
.wf-analytics > summary { cursor: pointer; color: var(--text-secondary); padding: 14px 0; }
.wf-analytics[open] > summary { margin-bottom: 10px; }
.wf-project-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 18px; }
.wf-project-heading > div { min-width: 0; }
.wf-project-heading .back-link { display: flex; width: fit-content; margin-bottom: 12px; }
.wf-project-heading .eyebrow { display: block; margin-bottom: 8px; }
.wf-project-heading h1 { font-size: 27px; line-height: 38px; letter-spacing: -.6px; }
.wf-project-heading select { max-width: 270px; }
.wf-journey { list-style: none; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); padding: 0; margin: 0; border-bottom: 1px solid var(--border); }
.wf-journey li { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; padding: 10px 12px; color: var(--text-secondary); border-bottom: 3px solid transparent; }
.wf-journey li > span { display: inline-flex; align-items: center; justify-content: center; width: 25px; height: 25px; flex-shrink: 0; border-radius: 50%; background: var(--border); font-size: 12px; }
.wf-journey li .icon { width: 14px; height: 14px; flex-basis: 14px; }
.wf-journey li strong { font-size: 14px; font-weight: 500; }
.wf-journey li small { display: block; width: 100%; padding-left: 34px; }
.wf-journey li.is-current { color: var(--brand); border-color: var(--brand); }
.wf-journey li.is-current > span { background: var(--brand); color: var(--surface); }
.wf-journey li.is-complete > span { background: var(--success-bg); }
.wf-full-flow { margin: 4px 0 12px; }
.wf-full-flow > summary { cursor: pointer; color: var(--text-secondary); padding: 10px 0; font-size: 12px; }
.wf-full-flow > p { padding: 0 16px 16px; color: var(--text-secondary); font-size: 12px; line-height: 22px; }
.wf-stage-main { display: flex; justify-content: space-between; align-items: center; gap: 32px; padding: 28px; }
.wf-stage-copy { flex: 1; min-width: 0; }
.wf-stage-eyebrow { display: flex; align-items: center; gap: 10px; margin-bottom: 13px; font-size: 12px; color: var(--text-secondary); }
.wf-stage-copy h2 { font-size: 23px; line-height: 32px; margin-bottom: 9px; }
.wf-stage-copy > p { color: var(--text-secondary); max-width: 650px; line-height: 24px; }
.wf-responsibility,.wf-stage-output { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; margin-top: 12px; font-size: 12px; }
.wf-responsibility > span,.wf-stage-output > span:first-child { color: var(--text-secondary); min-width: 72px; }
.wf-responsibility strong { font-weight: 500; }
.wf-next-action { flex: 0 0 240px; }
.wf-next-action .btn { width: 100%; min-height: 44px; }
.wf-next-action p { margin-top: 10px; color: var(--text-secondary); font-size: 12px; line-height: 20px; }
.wf-checks { border-top: 1px solid var(--border); padding: 8px 28px; }
.wf-check { display: flex; align-items: center; gap: 14px; padding: 15px 0; width: 100%; text-align: left; background: transparent; border: 0; border-bottom: 1px solid var(--border); }
.wf-check:last-child { border-bottom: 0; }
.wf-check > span:nth-child(2) { flex: 1; }
.wf-check strong { font-size: 13px; font-weight: 500; }
.wf-check small { display: block; color: var(--text-secondary); margin-top: 3px; }
.wf-check-symbol { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--surface-muted); }
.wf-check-symbol.is-done { background: var(--success-bg); }
.wf-check:hover strong { color: var(--brand); }
.wf-assist { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 18px 28px; background: var(--brand-wash); border-top: 1px solid var(--border); border-radius: 0 0 var(--radius) var(--radius); }
.wf-assist > span { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.wf-assist strong { font-size: 12px; font-weight: 500; }
.wf-assist small { color: var(--text-secondary); font-size: 12px; }
.wf-project-shortcuts { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.wf-stage-card + .card { margin-top: 20px; }
.wf-stage-details { margin: 20px 0; }
.wf-stage-details > summary { cursor: pointer; padding: 12px 0; color: var(--text-secondary); }
.wf-materials { margin-bottom: 20px; }
.wf-materials > summary { padding: 20px 24px; cursor: pointer; font-weight: 500; }
.wf-materials > summary span { margin-left: 8px; font-weight: 400; }
.wf-materials .card-body > h3 { margin: 14px 0 8px; }
.wf-materials .card-body > p { color: var(--text-secondary); line-height: 24px; }
.wf-material-list { margin: 18px 0; }
.wf-material { display: flex; align-items: center; gap: 12px; padding: 14px 0; width: 100%; text-align: left; background: transparent; border: 0; border-bottom: 1px solid var(--border); }
.wf-material > span { flex: 1; }
.wf-material strong { font-size: 13px; font-weight: 500; }
.wf-material small { display: block; margin-top: 3px; color: var(--text-secondary); }
.wf-inline-back { margin-bottom: 18px; }
.wf-project #co-panel > .co-approval-card { margin-bottom: 14px; }
.wf-project .co-tabs { flex-wrap: wrap; margin-bottom: 16px; }
.wf-project-heading .co-select-field select { min-height: 40px; padding: 8px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
.wf-milestones { margin: 18px 0; list-style: none; }
.wf-milestones li { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.wf-milestones small { color: var(--text-secondary); }
@media (max-width: 1050px) {
  .wf-project-heading { align-items: flex-start; flex-direction: column; gap: 14px; }
  .wf-stage-main { gap: 20px; }
  .wf-next-action { flex-basis: 200px; }
  .wf-journey li { padding: 14px 6px; gap: 7px; }
  .wf-assist { align-items: flex-start; }
  .wf-assist > span small { width: 100%; }
}
@media (max-width: 700px) {
  .wf-stage-main { flex-direction: column; align-items: stretch; padding: 20px; }
  .wf-next-action { flex-basis: auto; }
  .wf-stage-copy h2 { font-size: 21px; }
  .wf-project-heading h1 { font-size: 23px; line-height: 32px; }
  .wf-project-heading select { max-width: 100%; width: 100%; }
  .wf-project-heading > label { width: 100%; }
  .wf-journey { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .wf-journey li { padding: 12px 8px; }
  .wf-checks { padding: 6px 20px; }
  .wf-assist { flex-direction: column; padding: 18px 20px; }
  .wf-assist > .btn { width: 100%; }
  .wf-inbox-filters { padding: 0 16px 14px; gap: 4px; }
  .wf-inbox-filters .btn { font-size: 12px; }
  .wf-inbox-list { padding: 0 16px; }
  .wf-inbox-row { flex-wrap: wrap; gap: 10px; padding: 18px 0; }
  .wf-inbox-icon { display: none; }
  .wf-inbox-copy { flex-basis: calc(100% - 75px); }
  .wf-inbox-copy > div { gap: 4px; align-items: flex-start; flex-direction: column; }
  .wf-inbox-row > .badge { display: none; }
  .wf-project-grid { grid-template-columns: minmax(0,1fr); }
  .wf-resume-card { padding: 20px; }
  .wf-inbox .card-header { align-items: flex-start; gap: 10px; }
  .wf-inbox .card-header > .btn { white-space: nowrap; }
  .wf-check,.wf-material { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .wf-resume-card,.wf-check,.wf-material { transition: none; }
}

/* Keep approval evidence and the post-handover next step beside the decision. */
.wf-approval-evidence { margin: 20px 0; padding-top: 18px; border-top: 1px solid var(--border); }
.wf-approval-evidence > p { margin-top: 7px; }
.wf-approval-profile { display: grid; gap: 7px; margin: 16px 0; padding: 14px 16px; background: var(--surface-muted); border-radius: 10px; }
.wf-approval-profile p, .wf-approval-details p, .wf-approval-feedback p { overflow-wrap: anywhere; }
.wf-approval-profile strong { font-size: 12px; color: var(--text-secondary); }
.wf-approval-details { border-top: 1px solid var(--border); padding: 12px 0; }
.wf-approval-details > summary { cursor: pointer; font-weight: 600; line-height: 24px; }
.wf-approval-details > p, .wf-approval-details > ul { margin-top: 10px; }
.wf-approval-details ul { list-style: none; padding: 0; }
.wf-approval-details li { padding: 9px 0; border-bottom: 1px solid var(--border); }
.wf-approval-details li:last-child { border-bottom: 0; }
.wf-approval-details li > div { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 8px; }
.wf-approval-details li > p { margin-top: 5px; color: var(--text-secondary); font-size: 13px; }
.wf-approval-feedback { align-items: flex-start; margin: 14px 0; }
.wf-approval-feedback strong { display: block; margin-bottom: 6px; }
.wf-approval-feedback small { display: block; margin-top: 6px; color: var(--text-secondary); }
.wf-handoff-next { width: 100%; padding: 16px; border-radius: 10px; background: var(--surface-muted); }
.wf-handoff-next p { margin: 6px 0 12px; color: var(--text-secondary); }
.wf-handoff-reopen { margin-top: 16px; }
.wf-handoff-reopen > p { margin-top: 8px; }
@media (max-width: 700px) {
  .wf-approval-profile { padding: 12px; }
  .wf-handoff-next { padding: 14px; }
}