.stage[data-course="english-transformations-reply"] .speaker-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; }
.stage[data-course="english-transformations-reply"] .speaker-row > div:has(> .speaker-name-row) { grid-column:1; grid-row:2; min-width:0; }
.stage[data-course="english-transformations-reply"] .practice-head-actions { grid-column:2; grid-row:1; align-self:start; }
.reply-question-controls { grid-column:1; grid-row:1; display:flex; align-items:center; justify-content:flex-start; gap:8px; margin:0; white-space:nowrap; }
.reply-question-label { margin-right:4px; font-size:24px; line-height:1.25; font-weight:750; }
.stage[data-course="english-transformations-reply"] .speaker-name-row #speakerName { font-size:24px; line-height:1.25; }
.stage[data-course="english-transformations-reply"] #playButton.is-answer-playing { box-shadow:0 0 14px #65d8c860; border-color:#a1fff0; }
@media(max-width:420px) { .reply-question-label,.stage[data-course="english-transformations-reply"] .speaker-name-row #speakerName { font-size:21px; } .reply-question-controls { gap:6px; } }
.reply-question-controls[hidden], .reply-question-panel[hidden] { display:none; }
.stage[data-course="english-transformations-reply"] .reply-question-meter { align-self:center; margin:0; color:#6ab7ff; opacity:0; visibility:hidden; }
.stage[data-course="english-transformations-reply"].is-light-mode .reply-question-meter { color:#2563eb; }
.stage[data-course="english-transformations-reply"] .speaker-name-row .speaker-voice-meter { color:#b77bff; }
.stage[data-course="english-transformations-reply"].is-speaking:not(.has-intro):has(#replyQuestionPlay.is-playing) .reply-question-meter { opacity:1; visibility:visible; }
.stage[data-course="english-transformations-reply"]:has(#replyQuestionPlay.is-playing) .speaker-name-row .speaker-voice-meter { opacity:0; visibility:hidden; }
.reply-question-controls button { display:grid; place-items:center; width:40px; height:36px; color:#9ae8db; background:#65d8c815; border:1px solid #65d8c840; border-radius:12px; padding:8px; cursor:pointer; }
.reply-question-controls button svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.reply-question-controls button:hover, .reply-question-controls button.is-active { background:#65d8c835; border-color:#65d8c8; }
.reply-question-controls button.is-playing { color:#083b35; background:#72e5d3; border-color:#9cfff0; box-shadow:0 0 14px #65d8c850; }
.reply-question-controls button:focus-visible { outline:2px solid #80ebd8; outline-offset:3px; }
.is-light-mode .reply-question-controls button { color:#3b6d65; }
.reply-question-panel { margin: 18px 0 22px; padding: 16px 20px; border: 1px solid #65d8c850; border-left: 3px solid #65d8c8; border-radius: 14px; background: #153c3b50; text-align: left; }
#replyQuestionEnglish { margin: 0 0 6px; font-size: clamp(19px, 2.1vw, 25px); line-height: 1.4; font-weight: 700; color: #effcf9; }
#replyQuestionChinese { margin: 0; color: #c3d8d4; font-size: 14px; }
.is-light-mode .reply-question-panel { background: #eaf9f4; border-color: #93cfc4; }
.is-light-mode #replyQuestionEnglish { color: #173f3b; }
.is-light-mode #replyQuestionChinese { color: #3b6d65; }
.stage[data-course="english-transformations-reply"]:not(.is-light-mode):not(.has-intro) .scene-shade { background: none; }
.stage[data-course="english-transformations-reply"]:not(.is-light-mode):not(.has-intro) .scene-art { filter: saturate(1.04) contrast(1.02) brightness(1.04) !important; animation: none !important; }
@media(max-width:600px) { .reply-question-panel { margin:12px 0 16px; padding:12px 14px; } }
/* Leave room for the question and answer controls on laptop screens. */
@media (min-width: 901px) and (max-height: 850px) {
  .stage[data-course="english-transformations-reply"]:not(.has-intro) { --scene-height: 28vh; --scene-width: min(50vw, 620px); }
  .stage[data-course="english-transformations-reply"] .reply-question-panel { margin: 10px 0 12px; padding: 10px 16px; }
  .stage[data-course="english-transformations-reply"] #replyQuestionEnglish { margin: 0 0 4px; font-size: 21px; }
  .stage[data-course="english-transformations-reply"] .practice-cn { margin-top: 12px; }
}