/* A word-only, opt-in voice control. Effects mute and speech are separate. */
.pronunciation{margin:-8px 0 17px;position:relative;z-index:1;text-align:center}
.hear-word{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:10px 16px;border:1px solid #b99bd2;border-radius:50px;background:#160d2280;color:#eddefb;font:800 10px/1.2 'DM Sans',sans-serif;letter-spacing:.06em;cursor:pointer;touch-action:manipulation}
.hear-word:hover{background:#ffffff12;border-color:#e1c6f7}
.hear-word:focus-visible{outline:3px solid #d8ff79;outline-offset:4px}
.hear-word svg{height:20px;width:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hear-word.speaking{color:#d8ff79;border-color:#d8ff79;background:#d8ff7910}
#pronunciation-help{font-size:9px;line-height:1.5;margin:8px 0 0;color:#d3bfdc}
#pronunciation-status{font-size:10px;line-height:1.5;margin:6px auto 0;max-width:420px;color:#d8ff79}
#pronunciation-status:empty{display:none}
#pronunciation-status.voice-error{color:#ffe2b7}
.voice-bars{display:none;align-items:center;gap:3px;height:18px}
.speaking .voice-bars{display:flex}
.voice-bars i{height:5px;width:3px;border-radius:3px;background:currentColor;animation:voice-bounce .65s ease-in-out infinite alternate}
.voice-bars i:nth-child(2){animation-delay:-.2s}.voice-bars i:nth-child(3){animation-delay:-.4s}
@keyframes voice-bounce{to{height:17px}}
@media(max-width:700px){.pronunciation{margin:-9px 0 16px}.word-prompt{margin-bottom:22px}#pronunciation-help{font-size:9px}.word-card .tiny-note{line-height:1.6}}
@media(orientation:landscape) and (max-height:600px){.pronunciation{margin:2px 0 9px;display:grid;grid-template-columns:max-content 1fr;align-items:center;column-gap:12px;max-width:450px;margin-left:auto;margin-right:auto;text-align:left}.hear-word{grid-row:1/3;min-height:44px}#pronunciation-help{margin:0}#pronunciation-status{margin:2px 0 0;font-size:9px}.word-mode .big-word{margin:12px 0}.word-mode .word-instruction{margin-top:12px}.word-mode .word-prompt{margin:8px 0 12px}.word-mode .word-card .tiny-note{margin-top:10px}.word-mode .word-card{padding-top:16px;padding-bottom:16px}}
@media(prefers-reduced-motion:reduce){.voice-bars i{animation:none;height:12px}.voice-bars i:nth-child(2){height:17px}}