/* ============================================================
   Homeowner Dossier — confirm reward + expired states.
   Loaded alongside dossier_public.css (which provides the shared
   .dossier-confirmed / .dossier-expired page container). The
   reward is the one celebratory moment; expired stays calm, never
   a cold 404. All color via --ha-* tokens; no raw hex.
   ============================================================ */

/* Shared page container for both reward + expired states */
.dossier-confirmed,
.dossier-expired {
  max-width: 460px; margin: 0 auto; padding: 0 18px 40px;
}

/* 7. Confirm reward moment */
.dossier-confirmed { padding-top: 40px; text-align: left; }
.reward {
  background: var(--ha-dossier-reward); color: var(--ha-on-reward);
  border-radius: var(--ha-radius-lg); padding: 26px 22px;
  box-shadow: var(--ha-shadow-sheet);
}
.reward .check {
  width: 44px; height: 44px; border-radius: var(--ha-radius-pill);
  background: var(--ha-reward-disc); display: grid; place-items: center;
  box-shadow: var(--ha-shadow-inset-hi);
}
.reward .check svg { width: 22px; height: 22px; }
.reward h1 {
  font-size: 22px; font-weight: var(--ha-weight-bold); margin: 16px 0 0;
  letter-spacing: -0.01em; color: var(--ha-on-reward);
}
.reward p { font-size: 15px; line-height: 23px; color: var(--ha-reward-sub); margin: 10px 0 0; }
.reward .sig { color: var(--ha-on-reward); font-weight: var(--ha-weight-medium); }

/* 8. Expired — calm, never a cold 404 */
.dossier-expired { padding-top: 56px; text-align: center; }
.dossier-expired .mark {
  width: 52px; height: 52px; margin: 0 auto 18px; border-radius: var(--ha-radius-pill);
  background: var(--ha-surface); border: 1px solid var(--ha-border);
  display: grid; place-items: center; color: var(--ha-ink-muted);
  box-shadow: var(--ha-shadow-card);
}
.dossier-expired .mark svg { width: 24px; height: 24px; }
.dossier-expired h1 {
  font-size: 22px; font-weight: var(--ha-weight-bold); margin: 0; color: var(--ha-ink);
}
.dossier-expired p {
  font-size: var(--ha-fs-body); line-height: 25px; color: var(--ha-ink-muted);
  margin: 12px auto 0; max-width: 360px;
}