.cpc-answer {
  border-left-color: #28643a;
  background: #eef7f0;
}

.cpc-flex-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .65rem;
  margin: 1rem 0;
}

.cpc-flex-summary article {
  border: 1px solid var(--line);
  border-top: 4px solid var(--green);
  border-radius: .45rem;
  padding: .8rem;
  background: #fff;
}

.cpc-flex-summary strong,
.cpc-flex-summary span {
  display: block;
}

.cpc-flex-summary strong {
  color: var(--navy);
  margin-bottom: .25rem;
}

.cpc-flex-summary span {
  color: var(--muted);
  font-size: .84rem;
}

.cpc-flex summary,
.cpc-law summary,
.cpc-step summary {
  display: grid;
  align-items: center;
  gap: .75rem;
}

.cpc-flex summary,
.cpc-law summary {
  grid-template-columns: 1fr auto;
}

.cpc-step summary {
  grid-template-columns: 2rem minmax(220px, 1fr) minmax(150px, auto);
}

.cpc-step summary small {
  display: block;
  color: var(--muted);
  font-weight: 500;
  margin-top: .15rem;
}

.cpc-order {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  font-size: .78rem;
}

.cpc-purpose {
  font-size: 1rem;
  border-left: 4px solid var(--blue);
  padding-left: .75rem;
}

.cpc-record-grid,
.cpc-two-col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.cpc-record-grid section,
.cpc-two-col section {
  min-width: 0;
}

.cpc-record-grid .source-state {
  grid-template-columns: minmax(130px, .65fr) minmax(180px, 1.35fr);
}

.cpc-callouts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .6rem;
  margin: .9rem 0;
}

.cpc-callouts p {
  margin: 0;
  padding: .7rem;
  border-radius: .35rem;
  background: var(--soft);
  font-size: .86rem;
}

.cpc-overview {
  border: 1px solid var(--line);
  border-radius: .45rem;
  padding: .75rem;
  background: #fafbfd;
}

.match-sequence {
  counter-reset: match;
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .6rem;
}

.match-sequence li {
  counter-increment: match;
  position: relative;
  border: 1px solid var(--line);
  border-radius: .4rem;
  padding: .7rem .7rem .7rem 2.55rem;
  background: #fff;
}

.match-sequence li::before {
  content: counter(match);
  position: absolute;
  left: .65rem;
  top: .65rem;
  display: grid;
  place-items: center;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 50%;
  background: var(--blue);
  color: #fff;
  font-weight: 800;
  font-size: .7rem;
}

.match-bars {
  display: grid;
  gap: .32rem;
  padding: .75rem;
  border: 1px solid var(--line);
  border-radius: .4rem;
  background: #fff;
}

.match-bar-row {
  display: grid;
  grid-template-columns: 3.5rem minmax(80px, 1fr) 6.5rem;
  align-items: center;
  gap: .5rem;
  text-decoration: none;
  color: var(--ink);
  font-size: .78rem;
}

.match-bar-row i {
  display: block;
  width: var(--bar);
  min-width: 2px;
  height: .7rem;
  border-radius: .2rem;
  background: var(--blue);
}

.match-bar-row strong {
  text-align: right;
  color: var(--navy);
}

.cpc-trace,
.cpc-start-card {
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-left: 5px solid var(--green);
  border-radius: .45rem;
  background: #f7fbf8;
}

.cpc-trace p,
.cpc-start-card p {
  margin: .35rem 0;
}

.cpc-primary-link {
  display: inline-block;
  padding: .5rem .75rem;
  border-radius: .35rem;
  background: var(--navy);
  color: #fff;
  font-weight: 800;
  text-decoration: none;
}

.cpc-unknowns {
  padding: .8rem .8rem .8rem 2rem;
  border-left: 5px solid var(--warn);
  background: #fff8ec;
}

#cpc [id] {
  scroll-margin-top: 8rem;
}

#cpc [id]:focus {
  outline: 3px solid var(--blue);
  outline-offset: 3px;
}

.cpc-project-table {
  min-width: 1120px;
}

@media (max-width: 920px) {
  .cpc-flex-summary,
  .cpc-callouts,
  .match-sequence {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cpc-record-grid,
  .cpc-two-col {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .cpc-flex-summary,
  .cpc-callouts,
  .match-sequence {
    grid-template-columns: 1fr;
  }

  .cpc-step summary {
    grid-template-columns: 2rem 1fr;
  }

  .cpc-step summary .badge {
    grid-column: 1 / -1;
  }

  .cpc-record-grid .source-state {
    grid-template-columns: 1fr;
  }

  .match-bar-row {
    grid-template-columns: 3rem minmax(60px, 1fr) 5.8rem;
  }

  #cpc [id] {
    scroll-margin-top: 5rem;
  }
}

@media print {
  .cpc-flex-summary,
  .cpc-record-grid,
  .cpc-two-col,
  .cpc-callouts,
  .match-sequence {
    display: block;
  }

  .cpc-flex-summary article,
  .cpc-callouts p,
  .match-sequence li,
  .match-bars,
  .cpc-step {
    break-inside: avoid;
    margin: .35rem 0;
  }
}

/* v0.7.0 CPC story reconstruction: resident question -> governed answer -> money -> process -> evidence. */
#cpcView {
  --cpc-serif: Georgia, "Times New Roman", serif;
  max-width: 1180px;
  margin: 0 auto;
}

.cpc-first-screen {
  padding: clamp(1rem, 3vw, 2rem);
  border: 1px solid var(--line);
  border-top: 5px solid var(--navy);
  border-radius: .35rem;
  background: #fbfaf7;
}

.cpc-kicker,
.section-number {
  margin: 0 0 .45rem;
  color: var(--blue);
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}

#cpc-question,
.cpc-story-section > h3,
.cpc-next h3 {
  font-family: var(--cpc-serif);
  font-weight: 700;
  letter-spacing: -.015em;
}

#cpc-question {
  max-width: 900px;
  margin: .15rem 0 .8rem;
  font-size: clamp(1.75rem, 3.4vw, 2.85rem);
  line-height: 1.06;
}

.cpc-short-answer {
  max-width: 1000px;
  padding: .85rem 1rem;
  border-left: 4px solid var(--blue);
  background: #edf3f6;
  font-size: 1rem;
}

.cpc-plain {
  max-width: 950px;
  margin: .85rem 0;
}

.cpc-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .65rem;
  margin: 1rem 0;
}

.cpc-metrics article {
  padding: .8rem;
  border: 1px solid var(--line);
  border-radius: .3rem;
  background: #fff;
}

.cpc-metrics strong,
.cpc-metrics span,
.cpc-metrics small {
  display: block;
}

.cpc-metrics strong {
  color: var(--navy);
  font: 700 1.55rem/1 var(--cpc-serif);
}

.cpc-metrics span {
  margin: .35rem 0 .2rem;
  font-size: .82rem;
  font-weight: 800;
}

.cpc-metrics small {
  color: var(--muted);
  font-size: .72rem;
}

.cpc-jump,
.cpc-next nav {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}

.cpc-jump a,
.cpc-next a {
  padding: .45rem .65rem;
  border: 1px solid var(--blue);
  border-radius: 999px;
  color: var(--navy);
  background: #fff;
  text-decoration: none;
  font-size: .78rem;
  font-weight: 800;
}

.cpc-route-disclosure {
  margin: .8rem 0 1.8rem;
  padding: .7rem .85rem;
  border-left: 3px solid var(--line);
  color: var(--muted);
  background: #fafafa;
  font-size: .75rem;
}

.cpc-story-section {
  padding: 2rem 0;
  border-top: 1px solid var(--line);
}

.cpc-story-section > h3,
.cpc-next h3 {
  max-width: 850px;
  margin: .15rem 0 .8rem;
  font-size: clamp(1.4rem, 2.2vw, 1.9rem);
  line-height: 1.12;
}

.cpc-rule-columns,
.cpc-answer-grid,
.cpc-role-grid,
.cpc-fund-inputs,
.cpc-required-grid {
  display: grid;
  gap: .7rem;
}

.cpc-rule-columns,
.cpc-answer-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cpc-role-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 1rem 0;
}

.cpc-fund-inputs {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 1rem 0;
}

.cpc-required-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.cpc-rule-columns article,
.cpc-answer-grid article,
.cpc-role-grid article,
.cpc-fund-inputs article,
.cpc-required-grid article {
  min-width: 0;
  padding: .85rem;
  border: 1px solid var(--line);
  border-radius: .35rem;
  background: #fff;
}

.cpc-answer-grid article {
  border-top: 4px solid var(--blue);
  background: #fbfcfd;
}

.cpc-rule-columns h4,
.cpc-role-grid h4,
.cpc-fund-inputs h4,
.cpc-answer-grid h4,
.cpc-match-explain h4 {
  margin: .05rem 0 .45rem;
}

.cpc-rule-columns p,
.cpc-role-grid p,
.cpc-fund-inputs p,
.cpc-answer-grid p {
  margin: .35rem 0;
}

.cpc-answer-grid blockquote {
  margin: .65rem 0 .35rem;
  padding: .55rem .7rem;
  border-left: 4px solid var(--navy);
  color: var(--navy);
  background: #f1eee7;
  font-family: var(--cpc-serif);
  font-size: .95rem;
}

.cpc-required-grid strong,
.cpc-required-grid span {
  display: block;
}

.cpc-required-grid strong {
  color: var(--navy);
  font: 700 1.25rem/1.05 var(--cpc-serif);
}

.cpc-required-grid span {
  margin: .35rem 0;
  font-size: .78rem;
  font-weight: 850;
}

.cpc-required-grid p,
.source-note {
  color: var(--muted);
  font-size: .75rem;
}

.cpc-subhead {
  margin: 1.5rem 0 .65rem;
  font-size: 1rem;
}

.cpc-match-explain {
  margin: 1.25rem 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-left: 5px solid var(--blue);
  background: #f7fafb;
}

.cpc-history-table {
  min-width: 760px;
}

.cpc-history-table th:first-child {
  width: 7rem;
}

.cpc-history-table td strong,
.cpc-history-table td small {
  display: block;
}

.cpc-history-table td strong {
  color: var(--navy);
  font-size: 1rem;
}

.cpc-history-table td small {
  margin-top: .2rem;
  color: var(--muted);
  font-size: .7rem;
}

.cpc-calc-table {
  min-width: 900px;
}

.cpc-supporting {
  margin: 1rem 0;
  border-color: #bdc7cf;
  background: #fafbfd;
}

.cpc-supporting > summary {
  font-size: .84rem;
}

.cpc-flow {
  max-width: 900px;
  margin: 1rem auto;
}

.cpc-flow article {
  display: grid;
  grid-template-columns: 2.15rem 1fr;
  gap: .75rem;
  padding: .85rem;
  border: 1px solid var(--line);
  border-radius: .35rem;
  background: #fff;
}

.cpc-flow article > span {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--navy);
  color: #fff;
  font-size: .8rem;
  font-weight: 850;
}

.cpc-flow h4,
.cpc-flow p {
  margin: .05rem 0 .35rem;
}

.cpc-flow i {
  display: block;
  margin: .15rem 0;
  color: var(--blue);
  text-align: center;
  font-style: normal;
  font-weight: 900;
}

.cpc-efficiency-section {
  margin-top: 2.5rem;
  padding: 1.35rem;
  border: 1px dashed #9aa8b3;
  border-top: 5px solid #6c7d8a;
  border-radius: .4rem;
  background: #f7f8f8;
}

.cpc-next {
  margin-top: 1.5rem;
  padding: 1.25rem;
  border-top: 1px solid var(--line);
  background: #fbfaf7;
}

@media (max-width: 980px) {
  .cpc-required-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cpc-role-grid,
  .cpc-fund-inputs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .cpc-first-screen {
    padding: .85rem;
  }

  #cpc-question {
    font-size: 1.5rem;
  }

  .cpc-metrics,
  .cpc-rule-columns,
  .cpc-answer-grid,
  .cpc-role-grid,
  .cpc-fund-inputs,
  .cpc-required-grid {
    grid-template-columns: 1fr;
  }

  .cpc-story-section {
    padding: 1.45rem 0;
  }

  .cpc-flow article {
    grid-template-columns: 1.8rem 1fr;
    padding: .7rem;
  }

  .cpc-flow article > span {
    width: 1.7rem;
    height: 1.7rem;
  }

  .cpc-efficiency-section {
    margin-left: -.35rem;
    margin-right: -.35rem;
    padding: .8rem;
  }
}

@media print {
  .cpc-first-screen,
  .cpc-story-section,
  .cpc-efficiency-section,
  .cpc-next {
    break-before: auto;
  }

  .cpc-jump,
  .cpc-next,
  .cpc-route-disclosure + .cpc-story-section {
    page-break-before: auto;
  }

  .cpc-metrics,
  .cpc-rule-columns,
  .cpc-answer-grid,
  .cpc-role-grid,
  .cpc-fund-inputs,
  .cpc-required-grid {
    display: block;
  }

  .cpc-metrics article,
  .cpc-rule-columns article,
  .cpc-answer-grid article,
  .cpc-role-grid article,
  .cpc-fund-inputs article,
  .cpc-required-grid article,
  .cpc-flow article {
    break-inside: avoid;
    margin: .35rem 0;
  }

  .cpc-supporting:not([open]) > *:not(summary) {
    display: none;
  }
}