.course-clinical-evidence {
  margin: 22px 0 28px;
  padding: clamp(16px, 2.2vw, 28px);
  border: 1px solid #91ada7;
  border-radius: 20px;
  background: #e8f1ec;
  color: #17332e;
  box-shadow: 0 16px 32px rgba(11, 38, 34, .10);
}

.course-clinical-evidence-head h3 {
  margin: 4px 0 8px;
  color: #11362e;
  font-size: clamp(1.2rem, 2.2vw, 1.65rem);
}

.course-clinical-evidence-head > p:last-child {
  max-width: 72ch;
  margin: 0 0 18px;
  line-height: 1.55;
}

.course-clinical-evidence-eyebrow {
  margin: 0;
  color: #126858;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.course-clinical-evidence-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 12px 18px;
  margin-bottom: 14px;
}

.course-clinical-evidence-controls label {
  display: grid;
  gap: 5px;
  min-width: 145px;
  color: #25483e;
  font-size: .83rem;
  font-weight: 700;
}

.course-clinical-evidence-controls select {
  min-height: 40px;
  border: 1px solid #77998d;
  border-radius: 8px;
  padding: 6px 9px;
  background: #fff;
  color: #16382d;
}

.course-clinical-evidence-controls .course-clinical-evidence-time {
  flex: 1 1 195px;
}

.course-clinical-evidence-controls input[type="range"] { width: 100%; accent-color: #008b68; }
.course-clinical-evidence-controls .course-clinical-evidence-mark { flex: 1 1 195px; }

.course-clinical-evidence-monitor {
  overflow: hidden;
  border: 8px solid #203238;
  border-radius: 15px;
  background: #071a1d;
  box-shadow: inset 0 0 0 1px #608581, 0 12px 20px rgba(10, 33, 32, .17);
}

.course-clinical-evidence-monitor-bar {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid #38615e;
  color: #bde9d6;
  font: 700 .72rem ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .06em;
}

.course-clinical-evidence-monitor canvas {
  display: block;
  width: 100%;
  height: 236px;
}

.course-clinical-evidence-readout {
  margin: 10px 0;
  color: #21423d;
  font-size: .87rem;
  line-height: 1.5;
}

.course-clinical-evidence-exercise {
  margin: 14px 0 18px;
  padding: clamp(13px, 2vw, 20px);
  border: 1px solid #8bac9e;
  border-radius: 13px;
  background: #f8fbf7;
}

.course-clinical-evidence-exercise-intro {
  margin: 0 0 12px;
  line-height: 1.5;
}

.course-clinical-evidence-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 15px;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
}

.course-clinical-evidence-choices legend {
  width: 100%;
  margin-bottom: 7px;
  font-weight: 750;
}

.course-clinical-evidence-choices label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 6px 9px;
  border: 1px solid #9bb8a8;
  border-radius: 8px;
  background: #fff;
  font-size: .87rem;
  line-height: 1.3;
  cursor: pointer;
}

.course-clinical-evidence-choices input { accent-color: #126858; }

.course-clinical-evidence-exercise button {
  min-height: 40px;
  margin: 3px 10px 3px 0;
  padding: 8px 13px;
  border: 1px solid #0b5749;
  border-radius: 9px;
  background: #0c6955;
  color: #fff;
  font-weight: 750;
  cursor: pointer;
}

.course-clinical-evidence-exercise button:disabled { opacity: .55; cursor: not-allowed; }
.course-clinical-evidence-exercise .course-clinical-evidence-retry { background: #fff; color: #0b5749; }
.course-clinical-evidence-exercise button[hidden] { display: none; }
.course-clinical-evidence-feedback {
  margin: 12px 0 0;
  padding: 12px;
  border-left: 4px solid #0b8069;
  background: #e7f3ec;
  line-height: 1.55;
}
.course-clinical-evidence-feedback[hidden] { display: none; }

.course-clinical-evidence-boundary {
  margin: 0 0 7px;
  color: #37514d;
  font-size: .8rem;
  line-height: 1.55;
}

.course-clinical-evidence > a { color: #075f52; font-size: .82rem; font-weight: 700; }
.course-clinical-evidence :is(select, input, button, a):focus-visible { outline: 3px solid #ef9b44; outline-offset: 2px; }

@media (max-width: 600px) {
  .course-clinical-evidence { padding: 14px; margin: 16px 0 22px; }
  .course-clinical-evidence-controls label { flex: 1 1 130px; }
  .course-clinical-evidence-monitor-bar { font-size: .63rem; }
}

@media (max-width: 380px) {
  .course-clinical-evidence-monitor-bar {
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
  }
}