.infrastructure-install-summary {
  display: grid;
  gap: 13px;
  margin: 12px 0 16px;
  padding: 15px;
  border: 1px solid color-mix(in srgb, var(--brand-orange) 24%, var(--border-color));
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-primary) 96%, var(--brand-orange-soft));
}
.infrastructure-install-summary__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.infrastructure-install-summary__header h2 { margin: 3px 0 4px; color: var(--text-primary); font-size: 17px; letter-spacing: -.025em; }
.infrastructure-install-summary__header p { max-width: 68ch; margin: 0; color: var(--text-secondary); font-size: 11px; line-height: 1.5; }
.infrastructure-install-summary__eyebrow { color: var(--brand-orange-deep); font-size: 8px; font-weight: 850; letter-spacing: .11em; }
.infrastructure-install-summary__period { display: grid; gap: 4px; flex: 0 0 148px; color: var(--text-tertiary); font-size: 9px; font-weight: 750; }
.infrastructure-install-summary__period select { width: 100%; min-height: 34px; padding: 6px 9px; border: 1px solid var(--border-color); border-radius: 8px; background: var(--surface-primary); color: var(--text-primary); font: inherit; font-size: 10px; }
.infrastructure-install-summary__body { display: grid; gap: 11px; min-width: 0; }
.infrastructure-install-summary__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.infrastructure-install-summary__stat { display: grid; gap: 4px; min-width: 0; padding: 9px 11px; border: 1px solid var(--divider-color); border-radius: 10px; background: var(--surface-secondary); }
.infrastructure-install-summary__stat > span { color: var(--text-tertiary); font-size: 8px; font-weight: 750; }
.infrastructure-install-summary__stat strong { color: var(--text-primary); font-size: 20px; line-height: 1; font-variant-numeric: tabular-nums; }
.infrastructure-install-summary__stat small { color: var(--text-secondary); font-size: 8px; line-height: 1.35; }
.infrastructure-install-summary__chart { display: grid; gap: 6px; }
.infrastructure-install-summary__group { overflow: hidden; min-width: 0; border: 1px solid var(--divider-color); border-radius: 10px; background: var(--surface-primary); transition: border-color .16s ease, background .16s ease; }
.infrastructure-install-summary__group:hover, .infrastructure-install-summary__group[open] { border-color: color-mix(in srgb, var(--brand-orange) 38%, var(--border-color)); background: color-mix(in srgb, var(--brand-orange-soft) 12%, var(--surface-primary)); }
.infrastructure-install-summary__group > summary { display: grid; grid-template-columns: minmax(155px, 225px) minmax(100px, 1fr) 70px 16px; align-items: center; gap: 12px; padding: 9px 11px; cursor: pointer; list-style: none; }
.infrastructure-install-summary__group > summary::-webkit-details-marker { display: none; }
.infrastructure-install-summary__group > summary:focus-visible { outline: 2px solid var(--brand-orange); outline-offset: -2px; }
.infrastructure-install-summary__identity { display: grid; justify-items: start; gap: 3px; min-width: 0; }
.infrastructure-install-summary__identity > strong { color: var(--text-primary); font-size: 11px; overflow-wrap: anywhere; }
.infrastructure-install-summary__type { padding: 2px 5px; border-radius: 999px; background: color-mix(in srgb, #3285c8 11%, var(--surface-primary)); color: #28699c; font-size: 7px; font-weight: 850; letter-spacing: .05em; }
.infrastructure-install-summary__type.is-nap { background: color-mix(in srgb, #158a68 10%, var(--surface-primary)); color: #08724f; }
.infrastructure-install-summary__track { display: block; height: 8px; overflow: hidden; border-radius: 999px; background: var(--divider-color); }
.infrastructure-install-summary__track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ff8a3d, var(--brand-orange)); transition: width .22s ease; }
.infrastructure-install-summary__count { display: grid; justify-items: end; gap: 1px; }
.infrastructure-install-summary__count strong { color: var(--text-primary); font-size: 16px; line-height: 1; font-variant-numeric: tabular-nums; }
.infrastructure-install-summary__count small { color: var(--text-tertiary); font-size: 7px; }
.infrastructure-install-summary__arrow { color: var(--text-tertiary); font-size: 15px; transition: transform .16s ease; }
.infrastructure-install-summary__group[open] .infrastructure-install-summary__arrow { transform: rotate(180deg); }
.infrastructure-install-summary__orders { display: grid; gap: 6px; padding: 8px 11px 10px; border-top: 1px solid var(--divider-color); }
.infrastructure-install-summary__orders > strong { color: var(--text-secondary); font-size: 9px; }
.infrastructure-install-summary__unverified { justify-self: start; padding: 3px 6px; border-radius: 999px; background: color-mix(in srgb, #bd7a31 13%, var(--surface-primary)); color: #875319; font-size: 8px; font-weight: 700; }
.infrastructure-install-summary__orders ul { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.infrastructure-install-summary__orders li { display: grid; grid-template-columns: minmax(125px, auto) minmax(0, 1fr); align-items: baseline; gap: 10px; padding: 5px 0; border-top: 1px solid var(--divider-color); font-size: 9px; }
.infrastructure-install-summary__orders li a { color: var(--brand-orange-deep); font-weight: 800; text-decoration: none; }
.infrastructure-install-summary__orders li span { color: var(--text-tertiary); text-align: right; overflow-wrap: anywhere; }
.infrastructure-install-summary__note { margin: 0; color: var(--text-tertiary); font-size: 8px; line-height: 1.45; }
.infrastructure-install-summary__state { margin: 0; padding: 12px; border: 1px dashed var(--border-color); border-radius: 9px; background: var(--surface-secondary); color: var(--text-secondary); font-size: 10px; }
.infrastructure-install-summary__state.is-error { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-color: color-mix(in srgb, #c94040 30%, var(--border-color)); color: #a52b2b; }
.infrastructure-install-summary__state button { flex: 0 0 auto; padding: 6px 9px; border: 1px solid var(--border-color); border-radius: 7px; background: var(--surface-primary); color: inherit; cursor: pointer; font: inherit; font-size: 9px; font-weight: 750; }
@media (max-width: 720px) {
  .infrastructure-install-summary { padding: 12px; }
  .infrastructure-install-summary__header { flex-direction: column; gap: 10px; }
  .infrastructure-install-summary__period { width: 100%; flex: 0 0 auto; }
  .infrastructure-install-summary__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
  .infrastructure-install-summary__stat { padding: 8px; }
  .infrastructure-install-summary__group > summary { grid-template-columns: minmax(0, 1fr) auto 16px; gap: 8px; padding: 9px; }
  .infrastructure-install-summary__track { grid-column: 1 / -1; grid-row: 2; }
  .infrastructure-install-summary__count { grid-column: 2; grid-row: 1; }
  .infrastructure-install-summary__arrow { grid-column: 3; grid-row: 1; }
  .infrastructure-install-summary__orders li { grid-template-columns: 1fr; gap: 2px; }
  .infrastructure-install-summary__orders li span { text-align: left; }
}
@media (max-width: 420px) {
  .infrastructure-install-summary__stats { grid-template-columns: 1fr; }
  .infrastructure-install-summary__stat { grid-template-columns: 1fr auto; align-items: center; }
  .infrastructure-install-summary__stat small { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  .infrastructure-install-summary__group, .infrastructure-install-summary__track i, .infrastructure-install-summary__arrow { transition: none; }
}
