.nh-reflection {
  margin-block: var(--xl);
  padding: 32px;
  border: 1px solid var(--ocean);
  border-top: 4px solid var(--deep-teal);
  background: var(--pearl);
  color: var(--charcoal);
}
.nh-reflection [hidden] { display: none !important; }
.nh-reflection h2 { margin: 12px 0 28px; }
.nh-reflection form { margin: 0; }
.nh-reflection label, .nh-reflection legend { font-family: var(--body); font-size: 1.05rem; font-weight: 500; line-height: 1.5; }
.nh-reflection select, .nh-reflection textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin: 10px 0 0;
  padding: 12px;
  border: 1px solid var(--ocean);
  border-radius: 4px;
  background: var(--pearl);
  color: var(--charcoal);
  font: 400 1rem/1.6 var(--body);
  letter-spacing: 0;
}
.nh-reflection textarea { resize: vertical; min-height: 114px; }
.nh-reflection :is(button, input, select, textarea):focus-visible { outline: 3px solid var(--teal); outline-offset: 4px; }
.nh-reflection__story { padding-block: 24px; border-bottom: 1px solid var(--sand); }
.nh-reflection__story p { margin: 0 0 18px; }
.nh-reflection fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.nh-reflection legend { margin-bottom: 10px; }
.nh-reflection fieldset label { display: flex; align-items: center; gap: 10px; min-height: 44px; cursor: pointer; font-weight: 400; }
.nh-reflection input[type="radio"] { width: 19px; height: 19px; margin: 0; accent-color: var(--deep-teal); flex: 0 0 19px; }
.nh-reflection [data-reflection-continuation]:not(:empty) { margin: 16px 0 0; color: var(--deep-teal); }
.nh-reflection__questions { list-style: none; counter-reset: questions; margin: 28px 0; padding: 0; }
.nh-reflection__questions li { counter-increment: questions; margin: 0 0 28px; padding: 0; }
.nh-reflection__questions label::before { content: counter(questions, decimal-leading-zero) ' / '; color: var(--teal); }
.nh-reflection__questions p { margin: 6px 0 0; font-size: 1rem; }
.nh-reflection__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; }
.nh-reflection button { cursor: pointer; max-width: 100%; white-space: normal; min-height: 44px; text-align: center; }
.nh-reflection .btn-text { background: transparent; }
.nh-reflection .btn-text:hover { color: var(--deep-teal); }
.nh-reflection__privacy, .nh-reflection__message { font-size: .95rem; line-height: 1.6; margin-top: 22px; }
.nh-reflection__message:empty { display: none; }
.nh-reflection__confirm { margin-top: 24px; border-block: 1px solid var(--sand); padding-block: 16px; }
.nh-reflection__confirm button { margin-right: 16px; }
.nh-reflection__result { border-top: 1px solid var(--sand); padding-top: 28px; margin-top: 32px; }
.nh-reflection__result h3 { font-family: var(--body); font-size: 1.35rem; font-weight: 500; line-height: 1.4; }
.nh-reflection__result dt { margin-top: 22px; font-weight: 500; color: var(--deep-teal); }
.nh-reflection__result dd { margin: 6px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.nh-reflection__result .nh-reflection__actions { margin-top: 28px; }
@media (max-width: 480px) {
  .nh-reflection { padding: 22px 16px; }
  .nh-reflection h2 { font-size: 1.8rem; line-height: 1.15; overflow-wrap: anywhere; }
  .nh-reflection .btn { width: 100%; padding-inline: 12px; }
}
