.question-picker {
  padding: 24px;
  margin: 0 0 28px;
  border: 1px solid #d6e9e5;
  border-radius: 16px;
  background: #f5faf8;
}
.article-body .question-picker h2 { margin: 0 0 12px; font-size: 24px; }
.question-picker label { display: block; font-weight: 600; margin-bottom: 8px; }
.question-picker-controls { display: flex; flex-wrap: wrap; gap: 12px; }
.question-picker select, .question-picker button {
  min-height: 44px;
  padding: 10px 14px;
  border-radius: 8px;
  font: inherit;
  font-size: 16px;
}
.question-picker select { flex: 1 1 220px; min-width: 0; max-width: 100%; border: 1px solid #75978e; background: #fff; color: #1a1a1a; }
.question-picker button { border: 0; background: #0c7567; color: #fff; cursor: pointer; }
.question-picker button:disabled { opacity: .65; cursor: default; }
.question-picker :focus-visible { outline: 3px solid #0c7567; outline-offset: 3px; }
.article-body .question-picker-output { min-height: 5.4em; margin: 20px 0 8px; font-size: 18px; line-height: 1.6; }
.question-picker [hidden] { display: none; }
.question-picker-links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 16px; }
.category-card[id], #pick-a-question { scroll-margin-top: 90px; }
@media (max-width: 480px) {
  .question-picker { padding: 18px; }
  .question-picker button { width: 100%; }
}

.article-body .question-picker a { color: #0c7567; }