.section-reader {
  max-width: 54rem;
  margin: 0 0 clamp(2rem, 5vw, 3.5rem);
  padding: clamp(1rem, 3vw, 1.7rem);
  border-radius: .65rem;
  background: #e6ebdf;
  color: var(--forest);
}

.prose .section-reader h2 {
  margin: 0 0 .65rem;
  font-size: clamp(1.45rem, 2.5vw, 2rem);
}

.section-reader-controls,
.section-reader-actions {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: .65rem;
}

.section-reader-choice {
  flex: 1 1 14rem;
  min-width: 0;
}

.section-reader label {
  display: block;
  margin: 0 0 .25rem;
  font-size: .9375rem;
  font-weight: 650;
}

.section-reader select {
  display: block;
  width: 100%;
  min-height: 44px;
  padding: .5rem;
  border: 1px solid #768a7d;
  border-radius: 4px;
  background: #fffdf6;
  color: inherit;
  font: inherit;
  font-size: 1rem;
  text-overflow: ellipsis;
}

.section-reader .button {
  min-height: 44px;
  padding: .45rem .7rem;
  gap: .35rem;
  font-size: .9375rem;
}

.section-reader-play {
  min-width: 7.3rem;
}

.section-reader .button:disabled {
  opacity: .55;
  cursor: default;
}

.prose .section-reader-status {
  margin: .45rem 0 0;
  font-size: .9375rem;
  line-height: 1.5;
}

.section-reader-status:empty {
  margin: 0;
}

@media print {
  .section-reader { display: none; }
}