.riddle-voice{width:min(100%,660px);margin:12px auto 0;text-align:center}
.voice-heading{margin-bottom:22px}.voice-heading h1{margin-top:14px;font-size:clamp(23px,2.3vw,30px);word-break:keep-all}
.voice-card{padding:28px 36px 20px;border:2px solid var(--line);border-radius:28px;background:#fff;box-shadow:0 6px 0 #bed7ea}
.voice-mascot{width:100px;height:100px;margin:auto;display:grid;place-items:center;border:2px solid #f2ce66;border-radius:32px;background:#fff4c8;font-size:56px;transform:rotate(-4deg)}
.voice-answer-label{color:var(--muted);font-size:14px;margin-top:12px;font-weight:700}
.voice-sentence{margin:8px 0 10px;font-size:clamp(28px,3.2vw,43px);font-weight:900;line-height:1.45;word-break:normal;text-wrap:balance}
.voice-sentence span{display:inline-block}.voice-word-good{color:#137d51}.voice-word-retry{color:#c64040;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:8px}
.riddle-listen-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:14px 0 8px}
.riddle-listen-row .button{min-height:44px;padding:8px 14px;border-color:#dbe7f1;border-radius:12px;background:#f7faff;color:var(--muted);box-shadow:none;font-size:16px;line-height:1.5}
.riddle-listen-row .button:hover:not(:disabled){background:#eaf2ff;color:var(--blue-dark)}
.voice-input{height:66px;display:flex;align-items:center;justify-content:center;gap:12px;max-width:380px;margin:auto}.voice-mic-icon{font-size:28px;opacity:.7}.voice-result-icon{color:#d0a21a;font-size:27px;letter-spacing:8px}
.riddle-voice .mic-waveform{display:block;width:100%;height:54px;max-width:290px;border-radius:14px;background:#eef8f3}.riddle-voice .mic-waveform path{fill:none;stroke:#18865e;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.voice-time{font-size:13px;color:var(--muted);min-width:32px}
.voice-message{min-height:48px;display:grid;align-content:center;font-size:14px;color:var(--muted);line-height:1.6;word-break:keep-all}.voice-error{color:#a14233}
.voice-controls{max-width:360px;margin:16px auto 0}.voice-controls .button{width:100%;min-height:52px;font-size:18px}.voice-tries{display:flex;justify-content:center;gap:7px;margin-top:19px}.voice-tries span{height:8px;width:8px;border-radius:50%;background:#356de8}.voice-tries .used{background:#dce5ef}
.voice-skip{margin-top:18px;padding:8px 16px}.voice-won{border-color:#4baa7d;background:#fbfffc}.voice-won .voice-mascot{animation:reward-in .35s ease-out}.voice-badge{margin-top:16px;border-radius:12px;background:#fff3c3;color:#72551e;padding:10px 12px;font-size:14px;font-weight:800}
@media(max-width:760px){.riddle-voice{margin-top:8px}.voice-heading{margin-bottom:18px}.voice-card{padding:22px 20px 18px;border-radius:23px}.voice-mascot{width:82px;height:82px;font-size:45px;border-radius:26px}.voice-sentence{font-size:31px}.voice-heading h1{font-size:23px}.voice-input{height:60px}.voice-controls{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.voice-won .voice-mascot{animation:none}}

/* The speaking turn takes the question's place; the original clip remains beside it. */
.clue-practice-panel{display:flex;align-items:center;align-self:stretch}
.clue-voice{margin:0;width:100%;min-width:0}.clue-voice .voice-heading{margin-bottom:12px}.clue-voice .voice-heading h2{font-size:22px;margin-top:9px}
.clue-voice .voice-card{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}.clue-voice .voice-sentence{font-size:clamp(24px,2.3vw,31px);line-height:1.45;margin:16px 0 10px}
.voice-translation{color:var(--muted);font-size:14px;line-height:1.6;word-break:keep-all}.clue-voice .voice-input{height:50px;margin-top:12px}.clue-voice .voice-message{min-height:44px;font-size:13px}.clue-voice .voice-controls{margin-top:12px}.clue-voice .voice-controls .button{min-height:47px;font-size:16px}.clue-voice .voice-skip{margin-top:12px;font-size:13px}.clue-voice-earned{font-size:14px;color:var(--green);font-weight:800}
@media(max-width:760px){.clue-voice .voice-heading{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:10px}.clue-voice .voice-heading h2{margin:0;font-size:18px}.clue-voice .voice-sentence{font-size:25px;margin-top:12px}.clue-voice .voice-input{height:42px;margin-top:6px}.clue-voice .voice-message{min-height:36px}.clue-voice .voice-controls{margin-top:8px}.clue-voice .voice-tries{margin-top:14px}.clue-voice .voice-skip{margin-top:4px}.clue-practice-panel{padding:16px}}

.clue-voice .voice-heading{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}.voice-sequence{font-size:13px;font-weight:800;color:var(--muted);white-space:nowrap}

/* Keep spoken sentences as prominent as the larger riddle questions. */
.riddle-voice{width:min(100%,920px)}
.voice-heading h1{font-size:34px}
.voice-card{padding:36px 44px 28px}
.voice-sentence{font-size:clamp(36px,3.2vw,54px)}
.voice-message,.voice-translation{font-size:18px}
.voice-controls{max-width:460px}.voice-controls .button{min-height:60px;font-size:21px}
.clue-voice .voice-heading h2{font-size:28px}
.clue-voice .voice-sentence{font-size:clamp(29px,2.2vw,40px)}
.clue-voice .voice-message{font-size:17px;min-height:54px}
.clue-voice .voice-controls .button{min-height:56px;font-size:19px}
.clue-voice .voice-skip,.voice-sequence,.clue-voice-earned{font-size:16px}
@media(max-width:760px){
 .voice-heading h1{font-size:27px}.voice-card{padding:26px 20px 22px}
 .voice-sentence{font-size:34px}.voice-message,.voice-translation{font-size:16px}
 .clue-voice .voice-heading h2{font-size:24px}.clue-voice .voice-sentence{font-size:28px}
 .clue-voice .voice-message{font-size:16px}.clue-voice .voice-controls .button{min-height:52px;font-size:18px}
}
