.branch-summary-heading {
  align-items: flex-end;
  gap: 20px;
}
.branch-summary-heading p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.summary-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px 14px;
  color: var(--muted);
  font-size: 11px;
}
.summary-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
.summary-legend i,
.mini-status i {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #a0a8a0;
}
.summary-legend i.red,
.mini-status.red i { background: var(--red); }
.summary-legend i.yellow,
.mini-status.yellow i { background: var(--yellow); }
.summary-legend i.green,
.mini-status.green i { background: var(--green); }
.summary-legend i.none,
.mini-status.none i { background: #9ca59d; }

.first-version-summary {
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.first-version-summary table {
  min-width: 1480px;
  width: 100%;
  table-layout: fixed;
}
.first-version-summary th {
  padding: 11px 9px;
  color: #617067;
  font-size: 10px;
  letter-spacing: .04em;
  line-height: 1.25;
  text-transform: uppercase;
  background: #f5f8f5;
  white-space: normal;
  overflow-wrap: anywhere;
}
.first-version-summary th:nth-child(1) { width: 180px; }
.first-version-summary th:nth-child(n+2):nth-child(-n+5) { width: 150px; }
.first-version-summary th:nth-child(6) { width: 225px; }
.first-version-summary th:nth-child(7) { width: 205px; }
.first-version-summary th:nth-child(8),.first-version-summary th:nth-child(9) { width: 135px; }
.summary-th-note {
  display: block;
  margin-top: 2px;
  color: #879087;
  font-size: 8px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.first-version-summary td {
  padding: 10px 8px;
  vertical-align: top;
  background: #fff;
}
.branch-summary-row > td:first-child {
  padding-left: 14px;
}
.branch-summary-row.row-red > td:first-child { box-shadow: inset 4px 0 var(--red); }
.branch-summary-row.row-yellow > td:first-child { box-shadow: inset 4px 0 var(--yellow); }
.branch-summary-row.row-green > td:first-child { box-shadow: inset 4px 0 var(--green); }
.branch-summary-row.row-none > td:first-child { box-shadow: inset 4px 0 #a5ada7; }
.suspended-note {
  display: inline-flex;
  margin-top: 8px;
  padding: 3px 7px;
  border-radius: 999px;
  color: #315f91;
  background: #eaf3fb;
  font-size: 10px;
  font-weight: 700;
}

.branch-stage-card {
  position: relative;
  min-height: 76px;
  padding: 8px 8px 7px;
  border: 1px solid #e3e9e4;
  border-left-width: 3px;
  border-radius: 9px;
  background: #fcfdfc;
}
.stage-card-all {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  border: 0;
  border-radius: 9px;
  background: transparent;
  cursor: pointer;
}
.stage-card-all:hover:not(:disabled) { background: rgba(65,170,55,.045); }
.stage-card-all:focus-visible { outline: 3px solid rgba(36,105,189,.55); outline-offset: 2px; }
.stage-card-all:disabled { cursor: default; }
.branch-stage-card.tone-red { border-left-color: var(--red); }
.branch-stage-card.tone-yellow { border-left-color: var(--yellow); }
.branch-stage-card.tone-green { border-left-color: var(--green); }
.branch-stage-card.tone-none { border-left-color: #a5ada7; }
.stage-card-head {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 5px;
  margin-bottom: 10px;
  pointer-events: none;
}
.stage-card-head strong {
  color: #17251b;
  font-size: 20px;
  line-height: 1;
}
.stage-card-head span {
  color: #748078;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.risk-numbers {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: baseline;
  gap: 14px;
  min-height: 22px;
}
.risk-number {
  appearance: none;
  min-width: 12px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  padding: 2px;
  font-size: 16px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  cursor: pointer;
}
.risk-number:hover:not(:disabled) { background: #eef3ee; transform: translateY(-1px); }
.risk-number:focus-visible { outline: 2px solid #2469bd; outline-offset: 2px; }
.risk-number:disabled { cursor: default; opacity: .45; }
.risk-number.red { color: #cf332b; }
.risk-number.yellow { color: #d98200; }
.risk-number.green { color: #2d8b2c; }

.finance-stack {
  display: grid;
  gap: 5px;
}
.finance-stack > div {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: 6px;
  white-space: nowrap;
}
.finance-stack span {
  color: #4f5a53;
  font-size: 9px;
}
.finance-stack b {
  color: #26322a;
  font-size: 11px;
  text-align: right;
}
.finance-triple {
  display: grid;
  grid-template-columns: repeat(3,max-content);
  gap: 5px;
}
.finance-triple > span {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
  color: #26322a;
  font-size: 10px;
  font-weight: 900;
}
.finance-triple small {
  color: #7d877f;
  font-size: 7px;
  font-weight: 900;
  text-transform: uppercase;
}
.top-problem {
  display: grid;
  gap: 5px;
  color: #5f6a63;
  font-size: 11px;
  line-height: 1.35;
}
.problem-project {
  color: #28352d;
  font-size: 12px;
}
.first-version-summary .project-title { font-size: 13px; line-height: 1.25; }
.branch-status-stack {
  display: flex;
  align-items: center;
  min-height: 24px;
}
.traffic-light { display: block; width: 13px; height: 13px; border: 2px solid rgba(0,0,0,.08); border-radius: 50%; background: #9ca59d; box-shadow: 0 1px 2px rgba(0,0,0,.18); }
.traffic-light.red { background: var(--red); }
.traffic-light.yellow { background: var(--yellow); }
.traffic-light.green { background: var(--green); }

@media (max-width: 900px) {
  .branch-summary-heading {
    align-items: flex-start;
    flex-direction: column;
  }
  .summary-legend {
    justify-content: flex-start;
  }
}

@media (max-width: 620px) {
  .portfolio-structure[open] .first-version-summary {
    margin-top: 8px;
  }
  .first-version-summary table {
    min-width: 1480px;
  }
}