.report-track-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  min-height: 42px;
  padding: .65rem .9rem;
  border: 1px solid #0f766e;
  border-radius: 12px;
  background: #ecfdf5;
  color: #0f5f58;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.reports-family-mode > article:not(.family-report-card) { display: none !important; }
.family-reports-heading { display:flex;align-items:center;gap:.8rem;flex:1 0 100%;width:100%;padding:1rem;border:1px solid #d7e8e4;border-radius:16px;background:linear-gradient(135deg,#eefaf6,#fff9dd); }
.family-reports-heading > span,.family-report-ico { display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:13px;background:#0f766e;color:#fff;font-size:1.2rem;font-weight:900; }
.family-reports-heading h2 { margin:0;color:#123c55;font-size:1.05rem; }
.family-reports-heading small { color:#64748b;font-weight:700; }
.family-reports-heading > b { margin-inline-start:auto;padding:.4rem .7rem;border-radius:999px;background:#d7a611;color:#fff; }
.list > article.family-report-card { display:flex;align-items:center;gap:.9rem; }
.family-report-info { flex:1;min-width:180px; }
.family-report-info h3 { margin:.12rem 0;color:#123c55; }
.family-report-info p { margin:.12rem 0 .4rem;color:#64748b; }
.report-stage { display:inline-flex;padding:.3rem .6rem;border-radius:999px;background:#fff4bf;color:#7b5d00;font-size:.75rem;font-style:normal;font-weight:850; }
.report-stage.stage-4 { background:#dcf7ea;color:#0f6b52; }
.report-stage.stage-0 { background:#e8eef2;color:#475569; }
.family-report-actions { display:grid;gap:.5rem;min-width:150px; }
.family-report-download { display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:42px;padding:.65rem .9rem;border:0;border-radius:12px;background:#123c55;color:#fff;font:inherit;font-weight:800;cursor:pointer; }
.family-report-download span { color:#ffe055;font-size:1.1rem; }

.report-track-btn span {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 8px;
  background: #0f766e;
  color: #fff;
  font-size: 1rem;
}

.report-track-btn[aria-expanded="true"] {
  background: #0f766e;
  color: #fff;
}

.report-status-panel {
  flex: 1 0 100%;
  width: 100%;
  margin-top: .85rem;
  padding: 1rem;
  border: 1px solid #cfe9df;
  border-radius: 16px;
  background: linear-gradient(145deg, #f7fffb, #eef8f5);
}

.list > article.status-open {
  flex-wrap: wrap;
}

.report-status-panel[hidden] { display: none; }

.report-status-header {
  display: flex;
  align-items: center;
  gap: .7rem;
  margin-bottom: 1rem;
}

.report-status-header small {
  display: block;
  margin-bottom: .1rem;
  color: #64748b;
  font-size: .82rem;
  font-weight: 700;
}

.report-status-header h3 {
  margin: 0;
  color: #123c55;
  font-size: 1.05rem;
}

.report-status-icon {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #0f766e;
  color: #fff;
  font-size: 1.25rem;
  font-weight: 900;
}

.report-status-steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .4rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.report-status-steps li {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .45rem;
  min-width: 0;
  text-align: center;
}

.report-status-steps li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 16px;
  inset-inline-start: calc(50% + 19px);
  width: calc(100% - 30px);
  height: 3px;
  border-radius: 3px;
  background: #d6e0de;
}

.report-status-steps li.done:not(:last-child)::after { background: #34a889; }

.step-mark {
  z-index: 1;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #0f766e;
  color: #fff;
  font-weight: 900;
}

.report-status-steps .current .step-mark {
  outline: 5px solid #d8f5e9;
  background: #d7a611;
}

.report-status-steps .waiting .step-mark { background:#dce5e3;color:#71817e; }

.step-label {
  color: #475569;
  font-size: .76rem;
  font-weight: 750;
  line-height: 1.45;
}

.report-status-steps .current .step-label {
  color: #123c55;
  font-weight: 900;
}

@media (max-width: 720px) {
  .list > article.has-report-tracker {
    flex-wrap: wrap;
  }

  .report-track-btn {
    width: 100%;
  }

  .list > article.family-report-card { align-items:flex-start;flex-wrap:wrap; }
  .family-report-actions { grid-template-columns:1fr;width:100%; }
  .family-report-download { width:100%; }
  .family-reports-heading { align-items:flex-start; }

  .report-status-steps {
    grid-template-columns: 1fr;
    gap: .65rem;
  }

  .report-status-steps li {
    flex-direction: row;
    text-align: start;
  }

  .report-status-steps li:not(:last-child)::after {
    top: 34px;
    inset-inline-start: 16px;
    width: 3px;
    height: calc(100% + .65rem);
  }

  .step-mark {
    flex: 0 0 34px;
  }

  .step-label {
    font-size: .9rem;
  }
}