.repair-journey {
  margin: 0 0 18px;
  padding: 24px;
  background: var(--night);
  border: 1px solid var(--night);
  box-shadow: 0 12px 30px rgba(24, 33, 31, 0.13);
}

.repair-journey-heading,
.repair-journey-footer {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.repair-journey .eyebrow { color: #b8d6ce; }
.repair-journey h2 { margin: 6px 0 0; color: var(--paper); font: 650 28px/1 Fraunces, Georgia, serif; letter-spacing: -0.03em; }
.repair-state-badge { flex: 0 0 auto; padding: 8px 10px; color: #b8d6ce; font: 600 10px/1 "DM Mono", monospace; letter-spacing: 0.1em; text-transform: uppercase; background: rgba(184, 214, 206, 0.1); border: 1px solid rgba(184, 214, 206, 0.45); }
.repair-state-badge.working { color: #ffdc87; background: rgba(231, 181, 66, 0.12); border-color: #e7b542; }
.repair-state-badge.healed { color: #b8d6ce; background: rgba(93, 171, 157, 0.16); border-color: #72b5a7; }
.repair-state-badge.attention { color: #ffdc87; background: rgba(231, 181, 66, 0.12); border-color: #e7b542; }
.repair-state-badge.failed { color: #ffd1c2; background: rgba(189, 78, 44, 0.2); border-color: #e38d71; }

.repair-now { max-width: 780px; margin: 17px 0 0; color: #d9e0da; font-size: 15px; line-height: 1.6; }
.break-proof { margin-top: 18px; padding: 14px 16px; color: #ffead0; background: rgba(189, 78, 44, 0.16); border: 1px solid rgba(227, 141, 113, 0.7); }
.break-proof-heading { display: flex; align-items: center; gap: 10px; }
.break-proof-badge { padding: 5px 7px; color: #ffd1c2; font: 600 9px/1 "DM Mono", monospace; letter-spacing: 0.09em; text-transform: uppercase; border: 1px solid rgba(227, 141, 113, 0.8); }
.break-proof-badge.is-confirmed { color: #fff0dc; background: rgba(189, 78, 44, 0.28); }
.break-proof h3 { margin: 0; color: inherit; font-size: 13px; }
.break-proof p { margin: 9px 0 0; font-size: 12px; line-height: 1.5; }
.break-proof-evidence { color: #ffd1c2; font: 500 11px/1.45 "DM Mono", monospace; }
.repair-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 9px; margin: 24px 0 0; padding: 0; list-style: none; }
.repair-step { min-width: 0; min-height: 142px; padding: 15px 14px; color: #b6c0b8; background: rgba(255, 253, 248, 0.06); border: 1px solid rgba(255, 253, 248, 0.16); }
.repair-step.is-done { color: #dce9e3; background: rgba(93, 171, 157, 0.14); border-color: rgba(132, 196, 180, 0.55); }
.repair-step.is-active { color: var(--paper); background: rgba(231, 181, 66, 0.16); border-color: #e7b542; box-shadow: inset 3px 0 0 #e7b542; }
.repair-step.is-attention { color: #fff2bf; background: rgba(231, 181, 66, 0.16); border-color: #e7b542; }
.repair-step.is-failed { color: #ffe1d7; background: rgba(189, 78, 44, 0.18); border-color: #e38d71; }
.repair-step-number { display: grid; width: 25px; height: 25px; place-items: center; color: inherit; font: 600 11px/1 "DM Mono", monospace; border: 1px solid currentColor; border-radius: 50%; }
.repair-step h3 { margin: 16px 0 5px; color: inherit; font-size: 13px; line-height: 1.25; }
.repair-step p { margin: 0; color: inherit; font-size: 11px; line-height: 1.45; opacity: 0.82; }

.repair-journey-footer { align-items: center; margin-top: 16px; }
.repair-help { max-width: 720px; margin: 0; color: #c7d1c9; font-size: 12px; line-height: 1.5; }
.repair-details-button { padding: 10px 12px; color: var(--night); font-weight: 700; background: #e7b542; border: 1px solid #e7b542; }
.repair-details-button:hover { background: #f2ca65; }

@media (max-width: 1100px) {
  .repair-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 650px) {
  .repair-journey { padding: 19px; }
  .repair-journey-heading, .repair-journey-footer { align-items: flex-start; flex-direction: column; }
  .repair-journey h2 { font-size: 25px; }
  .repair-steps { grid-template-columns: 1fr; }
  .repair-step { min-height: 0; }
}
