.recommendation-panel {
  border-top: 6px solid var(--green);
}
.recommendation-status {
  padding: 7px 10px;
  border-radius: 999px;
  background: #fff2d9;
  color: #825007;
  font-size: .8rem;
}
.recommendation-lead {
  padding: 16px 18px;
  border-radius: 12px;
  background: #eaf5f0;
  line-height: 1.55;
}
.spatial-answer { margin-top: 14px; padding: 18px; border: 2px solid #1a6d75; border-radius: 14px; }
.spatial-answer h3 { margin: 0 0 12px; }
.spatial-answer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.spatial-answer-grid article { padding: 15px; border-radius: 11px; background: #eef7f7; }
.spatial-answer-grid article.do-not-gate { background: #fff0ed; border: 1px solid #e2afa5; }
.spatial-answer-grid b { color: #125968; }
.spatial-answer-grid p { margin: 8px 0; line-height: 1.45; font-size: .91rem; }
.spatial-answer-grid small { display: block; color: var(--muted); line-height: 1.4; }
.flood-decision-label, .flood-flow-label { border: 0; border-radius: 6px; box-shadow: 0 1px 5px #1235; font-weight: 800; color: #173d38; }
.flood-flow-label { color: #075d86; font-size: .72rem; }
.recommendation-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  margin-top: 14px;
}
.recommendation-grid article {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 13px;
}
.recommendation-grid span {
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .08em;
  color: var(--green);
}
.recommendation-grid h3 { margin: 8px 0; }
.recommendation-grid p { line-height: 1.5; margin: 0 0 10px; }
.recommendation-grid small { display: block; color: var(--muted); line-height: 1.45; }
.recommendation-gates {
  margin-top: 14px;
  padding: 16px 18px;
  border-left: 5px solid var(--navy);
  background: #f0f5f7;
  border-radius: 10px;
}
.recommendation-gates h3 { margin: 0 0 8px; }
.recommendation-gates ol { margin: 0; padding-left: 20px; columns: 2; column-gap: 36px; }
.recommendation-gates li { break-inside: avoid; margin: 6px 0; line-height: 1.4; }
@media (max-width: 900px) {
  .recommendation-grid { grid-template-columns: 1fr; }
  .spatial-answer-grid { grid-template-columns: 1fr; }
  .recommendation-gates ol { columns: 1; }
}